1

我正在尝试使用以下代码让浏览器视口区将 Javascript 变量传递给 PHP：

第一个代码

<?php
if (isset($_GET['width']) AND isset($_GET['height'])) {
  // output the geometry variables
  echo "Screen width is: ". $_GET['width'] ."<br />\n";
  echo "Screen height is: ". $_GET['height'] ."<br />\n";
} else {
  // pass the geometry variables
  // (preserve the original query string
  //   -- post variables will need to handled differently)

  echo "<script language='javascript'>\n";
  echo "  location.href=\"${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}"
            . "&width=\" + screen.width + \"&height=\" + screen.height;\n";
  echo "</script>\n";
  exit();
}
?>

上面的代码给了我屏幕宽度和高度，这在包括 IE6、7 和 8 在内的所有浏览器中都可以正常工作。

但是当我将它更改为 from screen.width to window.innerWidth 和 screen.height to window.innerHeight

像这样 . "&width=\" + window.innerWidth + \"&height=\" + window.innerHeight;\n";

它在所有浏览器中都可以正常工作，但对于 IE6、7 和 8，它说

Screen width is: undefined
Screen height is: undefined

在网上寻找解决方案时，我发现了另一段代码：

第二代码

<script type="text/javascript">
var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],x=w.innerWidth||e.clientWidth||g.clientWidth,y=w.innerHeight||e.clientHeight||g.clientHeight;

document.write('<p>Your viewport size is '+x+' x '+y+'</p>');
</script>

此代码显示浏览器视口，它在包括 IE6、7 和 8 在内的所有浏览器中都可以正常工作。

当我在 php 文件中同时运行这两个代码时，第一个显示为undefinedabd，第二个完美运行。请看下面的截图

我不是新手程序员，无法将第二个代码连接到第一个逻辑。请帮我这样做。

以下是所有浏览器的屏幕截图：

互联网浏览器 6

互联网浏览器 6

互联网浏览器 7

互联网浏览器 7

互联网浏览器 8

互联网浏览器 8

互联网浏览器 9

互联网浏览器 9

狐狸

狐狸

谷歌浏览器

谷歌浏览器

歌剧

歌剧

苹果浏览器

苹果浏览器

4

4 回答 4

2

IE8 及更低版本不支持 window.innerHeight/Width。尝试使用document.documentElement.clientHeight/document.documentElement.clientWidth

于 2012-04-30T07:55:27.893 回答
1

让我们以更漂亮的格式布置第二个代码

<script type="text/javascript">
    var w=window;
    var d=document;
    var e=d.documentElement;
    var g=d.getElementsByTagName('body')[0];
    var x=w.innerWidth||e.clientWidth||g.clientWidth;
    var y=w.innerHeight||e.clientHeight||g.clientHeight;

    document.write('<p>Your viewport size is '+x+' x '+y+'</p>');
</script>

Javascript 有一个很好的小技巧，||可以将 (or) 运算符用作 if/else

例如，该行var x=w.innerWidth||e.clientWidth||g.clientWidth;是以下内容的简写

var x = undefined;
if (w.innerWidth) {
    x = w.innerWidth;
} else if (e.clientWidth) {
    x = e.clientWidth;
} else if (g.clientWidth) {
    x = g.clientWidth;
}

所以，这里发生的事情是 IE 没有定义变量window.innerWidth，因此你得到了undefined. Yout 代码在这里停止，而工作代码尝试其他一些变量，那些是document.documentElement.clientWidth（文档的宽度）和document.getElementsByTagName('body')[0].clientWidth（页面正文的宽度）

Internet Explorer 定义了其中的 1 个，它为您提供了正确的结果

回到你的代码：

将以下内容放在 HTML 页面中的某处

<script type="text/javascript">
    function GetScreenSize() {
        var w=window;
        var d=document;
        var e=d.documentElement;
        var g=d.getElementsByTagName('body')[0];
        var x=w.innerWidth||e.clientWidth||g.clientWidth;
        var y=w.innerHeight||e.clientHeight||g.clientHeight;
        return {x:x, y:y};
    }
</script>

echo "  var sz = GetScreenSize()\n"; //Call the function to get the screen size
echo "  location.href='${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}&width=' + sz.x + '&height=' + sz.x;\n";
于 2012-04-30T08:02:23.943 回答
0

只是结合两个脚本？在你的标签中回显这个：

echo("var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],x=w.innerWidth||e.clientWidth||g.clientWidth,y=w.innerHeight||e.clientHeight||g.clientHeight;")

echo("location.href=\"${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}"
        . "&width=\" + x + \"&height=\" + y;\n";")
于 2012-04-30T07:56:23.733 回答
0

谢谢安德鲁布洛克，你的代码也为我工作......

<?php
        echo "<br /><br />";
        if (isset ($_REQUEST['width'])) {
            $width=$_REQUEST['width'];
        } else {
            $width=0;
        }

        if (isset ($_REQUEST['height'])) {
            $height=$_REQUEST['height'];
        } else {
            $height=0;
        }
    ?>
    <html>
            <head>
                    <title> width=<?echo $width?> & height=<?echo $height?> </title>
                    <script type="text/javascript">
                        function GetScreenSize() {
                            var w=window;
                            var d=document;
                            var e=d.documentElement;
                            var g=d.getElementsByTagName('body')[0];
                            var x=w.innerWidth||e.clientWidth||g.clientWidth;
                            var y=w.innerHeight||e.clientHeight||g.clientHeight;
                            return {x:x, y:y};
                        }
                        var size=GetScreenSize();
                    </script>
            </head>
            <body>
                    <br />
                    width is <?echo $width?>
                    <br />
                    height is <?echo $height?>
            </body>
    </html>
    <?php
        if (!isset($_REQUEST['width'])&& !isset($_REQUEST['height'])){
            echo "<script language='javascript'>\n";
            echo "  var sz = GetScreenSize()\n";
            echo "  location.href=\"${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}"
                    . "&width=\" + sz.x + \"&height=\" + sz.y;\n";
            echo "</script>\n";
      }
    ?>

尝试“ http://192.168.0.9:6060/second/temp_1.php ”

你会得到

结果

谢谢

于 2012-04-30T09:34:02.290 回答