简体   繁体   English

使用PHP显示浏览器窗口宽度

[英]display browser window width using PHP

I would like my PHP script to be able to access the width of the browser window. 我希望我的PHP脚本能够访问浏览器窗口的宽度。 I've been reading up on this, and PHP can't access this information itself, but Javascript/jQuery can, and can then pass it to the server using AJAX, so PHP can get at it. 我一直在阅读这篇文章,PHP本身无法访问这些信息,但Javascript / jQuery可以,然后可以使用AJAX将其传递给服务器,因此PHP可以实现它。

Following a few solutions online I've written the following test file, and called it "test.php" 在线解决了几个问题后,我编写了以下测试文件,称之为“test.php”

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>  
</head>

<?php
if (!isset($_POST["window_width"])) {
?>

<script type="text/javascript">
    var window_width = $(window).width();
    $.ajax({
        type: "POST",
        data: "window_width="+window_width,
    });
</script>   

<?php
}

if(!isset($_POST["window_width"])) {
    echo "not set";
}

?>
</html>

Loading test.php displays "not set" which shows that the window_width variable is not being picked up by PHP. 加载test.php显示“未设置”,表明PHP没有获取window_width变量。 This seems weird to me, because Firebug shows that the variable is there (set at 1366 on my computer, as this is the width of my browser). 这对我来说似乎很奇怪,因为Firebug显示变量存在(在我的计算机上设置为1366,因为这是我的浏览器的宽度)。

How can I ensure that $_POST["window_width"] is set so that I can access it using PHP? 如何确保设置$ _POST [“window_width”]以便我可以使用PHP访问它?

Description 描述

I dont understand whats you goal ist but it looks like you forgot to wait till the DOM is ready. 我不明白你的目标是什么,但看起来你忘了等到DOM准备好了。

Sample 样品

$(function() {
   var window_width = $(window).width();
   $.ajax({
       type: "POST",
       data: "window_width="+window_width,
   });
});

Your server side code doesn't pause processing to wait for the JavaScript to run. 您的服务器端代码不会暂停处理以等待JavaScript运行。 You are dealing with two separate HTTP requests here. 您在这里处理两个单独的HTTP请求。

  1. The browser requests the HTML document 浏览器请求HTML文档
  2. Since $_POST['window_width'] is not set for that request. 由于没有为该请求设置$_POST['window_width'] PHP returns an HTML document that includes the script. PHP返回包含该脚本的HTML文档。 Since $_POST['window_width'] is still not set for that request, it also echos not set . 由于$_POST['window_width'] 仍然没有为该请求设置,因此它也没有设置回声。
  3. The browser receives the HTTP response and parses it. 浏览器接收HTTP响应并解析它。 As part of this process, it runs the JavaScript. 作为此过程的一部分,它运行JavaScript。
  4. The JavaScript makes a POST request to … wherever jQuery sends requests to by default since you didn't include a URI (which a very quick test suggests is the current URI). JavaScript发出POST请求...默认情况下jQuery发送请求的地方,因为你没有包含URI(一个非常快速的测试建议是当前的URI)。
  5. For this request $_POST["window_width"] is set and included in the document returned to JavaScript. 对于此请求, $_POST["window_width"]已设置并包含在返回给JavaScript的文档中。
  6. Since the JavaScript doesn't have a success handler (or any other code that runs when the HTTP request comes back) the browser doesn't do anything with that document. 由于JavaScript没有success处理程序(或HTTP请求返回时运行的任何其他代码),因此浏览器不会对该文档执行任何操作。

Ajax is a shorthand way of saying "Talk to the webserver with JavaScript". Ajax是一种简单的说法“用JavaScript与网络服务器对话”。 It doesn't stop HTTP being a stateless Request-Response protocol. 它不会阻止HTTP成为无状态请求 - 响应协议。

You haven't stated your usecase for getting the window width (which can change after the page has loaded), so it is hard to suggest a good solution to whatever problem you have. 你还没有说明你的用例来获取窗口宽度(页面加载后可以改变),因此很难为你遇到的任何问题提出一个很好的解决方案。 (You appear to have asked an XY Problem ). (您似乎已经问过XY问题 )。

The two common reasons for wanting to know the window width are: 想知道窗口宽度的两个常见原因是:

  • Statistics — in which case you can just process the data in PHP and not worry about rendering it to the client 统计信息 - 在这种情况下,您可以只使用PHP处理数据,而不必担心将其呈现给客户端
  • Changing the layout — which is usually better achieved with CSS media queries 更改布局 - 通常使用CSS媒体查询可以更好地实现

I don't think you need to use ajax in this case, the 'outer' (?) page needs to receive the data, not the 'inner' ajax request. 在这种情况下,我不认为你需要使用ajax,'outer'(?)页面需要接收数据,而不是'内部'ajax请求。

<?php session_start(); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>  
</head>

<?php
if (!isset($_POST["window_width"]) && !isset($_SESSION['window_width'])) {
?>
<body>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" id="window_width_form" style="display:none;">
<input name="window_width" id="window_width" value="" />
</form>
<script type="text/javascript">
    $(function(){
        $('#window_width').val($(window).width());
        $('#window_width_form').submit();
    });
</script>   
</body>
<?php
}
elseif (isset($_POST['window_width']) && !isset($_SESSION['window_width']))
{
    $_SESSION['window_width'] = $_POST['window_width'];
    exit(header("Location: {$_SERVER['PHP_SELF']}\r\n"));
}

if(!isset($_POST["window_width"]) && !isset($_SESSION['window_width'])) {
    echo "not set";
}

?>
</html>

Try 尝试

$.ajax({
        url : "your url goes here"
        type: "POST",
        data: {"window_width":window_width}
    });

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM