Question

我正在尝试发送包含设备尺寸的Cookie。如果设备是移动设备/小屏幕，我想阻止图像滑块加载。目的是减少移动设备的HTTP请求数量。

显示第二个页面加载/刷新滑块，因此我知道代码在某种程度上有效。

我的问题是;这是实现这种功能的最佳方式吗？是否可以读取cookie并在第一页加载时输出滑块？

我已经做了一些阅读，看起来需要刷新页面才能使cookie正常工作。对我来说，这似乎弄巧成拙，因为它增加了页面加载速度。可以用session-variable完成一些事情吗？

这是我的代码：

        document.cookie = "device_dimensions=" + screen.width + "x" + screen.height;

</head>


  $device_width = 0;
  $device_height = 0;

    // Read the device viewport dimensions
    if (isset($_COOKIE['device_dimensions'])) {
      $dimensions = explode('x', $_COOKIE['device_dimensions']);
      if (count($dimensions)==2) {
        $device_width = intval($dimensions[0]);
        $device_height = intval($dimensions[1]);
      }
    }
     if ($device_width > 0) {

    if ($device_width >= 640) {
       require('site/slider.php');
       }    

    else if ($device_width = 0) {
        require('site/slider.php');
      }
      }

以及工作示例：r.adamtoms.co.uk

非常感谢如何解决这个问题的解释！

亚当

Answer 1

PHP在服务器端执行，而JavaScript在浏览器中执行，因此代码的PHP部分首先执行，然后才运行JavaScript代码。

Answer 2

Cookie不适合您的任务。您案例的最佳解决方案是：

始终加载默认隐藏的滑块（即使用display：none; CSS-属性）;
使用Javascript检测屏幕尺寸;
如果尺寸正确，则显示隐藏的滑块;

在第3步中，您可能希望使用ajax加载滑块，如果您不想默认加载它（即保留网络流量）。

之后，您可以将屏幕尺寸存储到Cookie或会话中以进一步使用它们。

Answer 3

对于支票值，需要使用==

else if ($device_width == 0) {

你可以认为js重定向如下

<head>
<script type="text/javascript">
var x = screen.width;
if (x>=640) {
     window.location="http://www.yoursite.com/withslider.htm";
}
else
{
    window.location="http://www.yoursite.com/withoutslider.htm";
    }
</script>
</head>

Answer 4

好的，我决定遵循Xardas的建议。

以下是工作代码：

<style> @media screen and (max-width: 640px) {
.slider-content{display: none;}
}</style>

<div class="slider-content"></div>


$(window).width();   // returns width of browser viewport
var width = $(window).width(); 
if (width >= 642)  {
    $('.slider-content').load("/site/slider.php", function () {
        $('.slider-content').show(200);
    });
}

else {
    jQuery.noop()
}

如果屏幕宽度大于或等于642（我的第一个媒体查询开始），

将加载“slider.php”。

感谢所有人的帮助！

Answer 5

如果要在第一个php页面加载中使用cookie（用JS更改了值），则必须在php代码的顶部使用setcookie。然后创建cookie，并可以在JS中更改其值，并在第一次php页面加载中使用。

示例：

<?php
   setcookie('testCookie', 'testValue', 0, "/");
?>

<script type="javascript">
   document.cookie = "testCookie=123456;path=/";
</script>

<?php
   echo $_COOKIE['testCookie'];// return 123456
?>

在此示例中，如果您未在PHP代码顶部使用setcookie，则在第一页加载$ _COOKIE ['TestCookie']返回null。表示php无法达到在javascript中更改的cookie值（在第一页加载中）。此问题在第二页加载中不存在。

Cookie未在首页加载时读取

5 个答案: