0

私はこれについて数日間頭を悩ませてきました。皆さんが助けてくれることを願っています.

ページが読み込まれたときのブラウザーのサイズを調べる必要があります。

PHP と JavaScript を使用して PHP ページを作成しています。このページは次のコードで始まります。

if ( empty($_GET['w']) ) {
    echo '<!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">
            <body>
                <script type="text/javascript">
                    var winW = 630, winH = 460;
                    if (document.body && document.body.offsetWidth) {
                     winW = document.body.offsetWidth;
                     winH = document.body.offsetHeight;
                    }
                    if (document.compatMode=="CSS1Compat" &&
                        document.documentElement &&
                        document.documentElement.offsetWidth ) {
                     winW = document.documentElement.offsetWidth;
                     winH = document.documentElement.offsetHeight;
                    }
                    if (window.innerWidth && window.innerHeight) {
                     winW = window.innerWidth;
                     winH = window.innerHeight;
                    }
                    location.replace("'.$_SERVER['PHP_SELF'].'?w=" + winW + "&h=" + winH );
                </script>
            </body>
          </html>';
} else {
    $w = $_GET['w'];
    $h = $_GET['h'];
// my main page goes here
}

このコードは基本的に解像度を取得し、URL のクエリで送信された幅と高さでページをリロードして、PHP がそれらの値を使用できるようにします。

問題は、ユーザーがウィンドウのサイズを変更してからページをリロードすると、送信される値が古い値になることです (URL クエリにまだ含まれているため)。

ページがロードまたはリロードされるたびに、幅と高さの新しい値を見つけるにはどうすればよいですか?

ありがとう

4

4 に答える 4

0

100％確信はありませんが、ユーザーの操作によってページの再読み込みが開始されるのを停止することはできません。ただし、ページのアンロードイベントをリッスンして、必要なことを実行できます。

于 2012-04-26T03:29:38.800 に答える
0

GET経由で受け取った値をjsonとして返すスクリプトにポーリングして、jQueryを使用するのはどうですか。ユーザーの操作なしで画面のサイズが変更されると、任意の値に更新されます!

私の例では、段落を更新するだけですが、値を使って何かをすることもできます。(書くより少なくしてください ;p)

<?php
if(isset($_GET['width']) && $_GET['height']){
$size = array('width'=>intval($_GET['width']),'height'=>intval($_GET['height'])); 
echo json_encode($size);
die;
}
?>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
function poll(){
   setTimeout(function(){

      $.ajax({ url: "http://localhost/screensize.php?width="+ $(window).width() +"&height="+ $(window).height() +"",cache: false,
      success: function(data){
      //Do something with returned json
      $("#screensize").replaceWith("<p id=\"screensize\">Width:"+ data.width +"px Height:"+ data.height +"px</p>");
        //Next poll
        poll();
      }, dataType: "json"});
     // 1/2 a sec
  }, 500);
}

$(document).ready(function(){
    poll();
});
</script>

<p id="screensize">Updating...</p>
于 2012-04-26T03:56:08.593 に答える
0

あなたのこのコードの問題は、w と h が URL パラメーターとして存在する場合、まったく何もしないことです。ソースを見ると、空白になっています。

あなたがすべきことは、url パラメーターが現在ウィンドウにある実際の値と一致するかどうかを確認してから、実行しようとしているすべてのことを続行することです。

<?php

$w = 0;
$h = 0;
if (isset($_GET['w'])) {
    $w = $_GET['w'];
}
if (isset($_GET['h'])) {
    $h = $_GET['h'];
}

 echo '<!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">
        <body>
            <script type="text/javascript">
                window.onload = function(event) {
                    var winW = 630, winH = 460;
                    if (document.body && document.body.offsetWidth) {
                     winW = document.body.offsetWidth;
                     winH = document.body.offsetHeight;
                    }
                    if (document.compatMode=="CSS1Compat" &&
                        document.documentElement &&
                        document.documentElement.offsetWidth ) {
                     winW = document.documentElement.offsetWidth;
                     winH = document.documentElement.offsetHeight;
                    }
                    if (window.innerWidth && window.innerHeight) {
                     winW = window.innerWidth;
                     winH = window.innerHeight;
                    }

                    if (winW=='.$w.' && winH=='.$h.') {
                        document.write("Yay, victory!");
                    } else {
                        location.replace("'.$_SERVER['PHP_SELF'].'?w=" + winW + "&h=" + winH );
                    }
                }
            </script>
        </body>
      </html>';
// my main page goes here

?>
于 2012-04-26T03:56:33.430 に答える
0

Jクエリを使用します。おおよそ、このようなものが機能するはずです。.resize ハンドラーをウィンドウにアタッチします。

$(document).ready(function(){
  echoWindowDimensions();

  $(window).resize(function(){
      echoWindowDimensions();
  });
});

function echoWindowDimensions {
   var h = $(window).height();
   var w = $(window).width();
   alert('height'+h+'   width'+w);
}
于 2012-06-07T14:28:11.497 に答える