我正在尝试根据屏幕分辨率大小显示数据库中的结果。我在上周发布了一个关于如何获得宽度的问题，并且能够在这里借助一些想法来提出这个jquery，但是无法完成第二个方面，即根据大小显示结果：< / p>
<script type="text/javascript">
$(document).ready(function() {
var $window = $(window);
function checkWidth() {
var windowsize = $window.width();
if (windowsize = 1600) {
//**This is where I need to define the $maxresults value, but how?**
}
}
// Execute on load
checkWidth();
// Bind event listener
$(window).resize(checkWidth);
});
</script>
现在，这是第二部分：
<?php
// get the function
include_once ('function.php');
$maxresults = 21;
if ($_GET['page']) {
$page = $_GET['page'];
}
else {
$page = 0;
}
$currentpage = $page;
$page = $page*$maxresults;
$numpages = QuickQuery("SELECT COUNT(id) FROM books WHERE visible=1");
$numpages = mysql_result($numpages, 0);
$numpages = $numpages/$maxresults-1;
//Show <maxresults> pages at a time
$result = GetBooksByRangeID($page, $maxresults);
DisplayResults($result);
?>
要显示的最大结果数量设置为21，但我想使用上面的jquery根据用户的屏幕分辨率定义数量;我会有各种尺寸。换句话说，我需要if语句说“根据找到的大小显示这么多结果”。那么如何编写if语句呢？
* 最后修订=部分工作，（尽管分辨率大小，所有结果仍设为最高6）*
<?php
// get the function
include_once ('function.php');
if(($_GET['w']) && ($_GET['h'])) {
$w = $_GET['w'];
$h = $_GET['h'];
}
if ($w == 1920) {
$maxresults = 24;
}
else if ($w == 1600) {
$maxresults = 24;
}
else if ($w == 1440){
$maxresults = 12;
}
else if ($w == 1366) {
$maxresults = 10;
}
else if ($w == 1024) {
$maxresults = 8;
}
else $maxresults = 6;
.....
答案 0 :(得分：1)
使用Ajax，这是需要做的事情
<html><body>
<div id="content"></div>
....
<script>
$(function(){
$.ajax({
url: 'file.php',
type: 'GET',
data: {h: screen.height, w: screen.width}
}).done(function ( data ) {
document.getElementById("content").innerHTML=data;
});
});
</script>
然后file.php将运行您的数据库查询，并根据通过ajax发送的h和w参数返回一个格式良好的结果集（即html表），该参数告诉您屏幕的高度和宽度。要执行此操作，只需根据$_GET['w']和$_GET['h']变量的大小设置$ page变量。见下文：
<?php
// get the function
include_once ('function.php');
$maxresults = 21;
$page = ( $_GET['page'] ? $_GET['page'] : 0 );
if(($_GET['w']) && ($_GET['h'])) {
$w = $_GET['w'];
$h = $_GET['h'];
//$maxresults = // calculate this depending on w and h
// i.e. if h > 1600 $maxresults = 20, else = 10
$currentpage = $page;
$page = $page * $maxresults;
$numpages = QuickQuery("SELECT COUNT(id) FROM books WHERE visible=1");
$numpages = mysql_result($numpages, 0);
$numpages = $numpages/$maxresults-1;
$result = GetBooksByRangeID($page, $maxresults);//Show <maxresults> pages at a time
//DisplayResults($result);
echo $results; // in a nice format (i.e. table) to be inserted into div via ajax
?>
您可以按如下方式计算$ maxresults：
if($w > 640) && ($h > 480) $maxresults = 5;
if($w > 800) && ($h > 600) $maxresults = 7;
if($w > 1024) && ($h > 768) $maxresults = 12;
....
if($w > 2560) && ($h > 1600) $maxresults = 21;
或者您可以按宽度对这些语句进行分组（因为我认为这不比高度重要，这意味着对用户的向下滚动较少）：
if ($w <= 1024) {
if ($h >= 768) $maxresults = 12; // 1024x(768 or higher)
else if ($h >= 600) $maxresults = 8; // 1024x(600~768)
else $maxresults = 6; // 1024x(599 or below)
}
else if ($w <= 1280) {
if ($h >= 1024) $maxresults = 14; // 1280x(1024 or higher)
else if ($h >= 960) $maxresults = 12; // 1280x(960~1024)
else if ($h >= 800) $maxresults = 10; // 1280x(800~960)
else if ($h >= 768) $maxresults = 8; // 1280x(768~800)
else $maxresults = 6; // 1280x(768 or below)
}
//and so on
修订
填充maxresults的代码编写得非常糟糕，这就是为什么它不起作用。试试这个：
<?php
include_once ('function.php');
$maxresults = -1;
if(($_GET['w']) && ($_GET['h'])) {
$w = $_GET['w'];
$h = $_GET['h'];
if ($w == 1920) {
$maxresults = 24;
} else if ($w == 1600) {
$maxresults = 24;
} else if ($w == 1440){
$maxresults = 12;
} else if ($w == 1366) {
$maxresults = 10;
} else if ($w == 1024) {
$maxresults = 8;
} else
$maxresults = 6;
}
echo $maxresults;
如果w和h未被发送，则输出-1或者将返回24或12，依此类推，具体取决于您的屏幕宽度。学习对代码进行一些基本的调试。我很难调试你的代码，而没有完全掌握它。
答案 1 :(得分：1)
只需通过de $_GET['windowsize']传递答案来加载ajax，然后使用通过“data”变量返回的结果（这可以是插入DOM的HTML，也可以是json字符串或者什么都有你希望它成为。
<script type="text/javascript">
$(document).ready(function() {
var $window = $(window);
function checkWidth() {
var windowsize = $window.width();
if (windowsize = 1600) {
$.ajax('/path/to/page?windowsize='+encodeURIComponent(windowsize)).done(function(data){
// the stuff to do when the php is loaded, for example, document.getElementById('x').innerHTML=data;
});
}
}
// Execute on load
checkWidth();
// Bind event listener
$(window).resize(checkWidth);
});
</script>
：
<?php
$windowsize = (int)$_GET['windowsize'];
if($windowsize >= 1200 && $windowsize < 1400)
{
echo "maxsize:200;minsize:300;";
}
if($windowsize >= 1400 && $windowsize < 1600)
{
echo "maxsize:300;minsize:400;";
}
然后在javascript中你可以使用：
..........done(function(data) {
$results = data.split(';');
for(c=0;c<$results.length;c++)
{
$tmp = $results[c].split(':');
if($tmp[0] == 'minsize')
{
minsize=parseInt($tmp[1]);
}
if($tmp[0] == 'maxsize')
{
maxsize=parseInt($tmp[1]);
}
});
答案 2 :(得分：0)
一个快速的解决方案是将每个Ajax的屏幕分辨率提交到php脚本。然后使用分辨率确定数量并返回电影，例如json。
这样的事情：
**编辑
的javascript：
$(document).ready(function() {'use strict';
var screenResolution, request;
//set screen resolution here
screenResolution = 1024;
request = $.ajax({
url : "url_to_php_script",
type : "POST",
dataType : "json",
contentType : 'application/x-www-form-urlencoded; charset=UTF-8',
data : {
"screenResolution" : screenResolution
}
});
request.fail(function() {
alert("fail");
});
request.done(function(movies) {
console.log(movies);
});
});
PHP：
$screenResolution = $_POST['screenResolution'];
//DO your normal Stuff
$jsonResult= json_encode($result);
return $jsonResult;