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を含むすべてのブラウザーで正常に機能します。

しかし、私がそれをからscreen.width に変更 window.innerWidth た瞬間screen.height window.innerHeight

このような . "&width=\" + window.innerWidth + \"&height=\" + window.innerHeight;\n";

すべてのブラウザで正常に動作しますが、IE6、7、8の場合は

Screen width is: undefined
Screen height is: undefined

解決策を求めてネットサーフィンをしているときに、別のコードを見つけました。

2番目のコード

<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として表示され、2番目のコードは完全に機能します。以下のスクリーンショットをご覧ください

私は初心者プログラマーではなく、2番目のコードを最初のロジックに接続することはできません。親切に私がそうするのを手伝ってください。

すべてのブラウザのスクリーンショットは次のとおりです。

Internet Explorer 6

Internet Explorer 6

Internet Explorer 7

Internet Explorer 7

Internet Explorer 8

Internet Explorer 8

Internet Explorer 9

Internet Explorer 9

Forefox

Forefox

グーグルクローム

グーグルクローム

オペラ

オペラ

サファリ

サファリ

4

4 に答える 4

2

window.innerHeight/Width は IE8 以前ではサポートされていません。使ってみてdocument.documentElement.clientHeight/document.documentElement.clientWidth

于 2012-04-30T07:55:27.893 に答える
1

2番目のコードをpretier形式でレイアウトしましょう

<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には、||(または)演算子を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

2 つのスクリプトを組み合わせるだけですか? タグでこれをエコーし​​ます:

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

ありがとうAndrew Brock、あなたのコードも私のために働いた...

<?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 に答える