使用jQuery确定浏览器宽度，然后调用一个(两个).php文件(来自同一目录)以加载一行PHP [英] Determine browser width with jQuery, then call one (out of two) .php files (from the same directory) to load a line of PHP

问题描述

我寻求一种使用jquery调用php文件的简单方法.

I seek a simple way to call a php file using jquery.

最终结果与我正在研究的Magento网站有关: http://bouquetsco.com/flowersplants.html ^^本页

The ultimate outcome has to do with a Magento site I am working on: http://bouquetsco.com/flowersplants.html ^^This page

此页面显示产品:连续3个.

This page displays products: 3 in a row.

    <?php $this->setColumnCount(3); ?>
    <?php $this->setColumnCount(2); ?>

^^此php代码手动设置产品列数.

^^This php code manually sets the number of product columns.

默认情况下，页面显示为3宽，看起来不错.直到，浏览器窗口将尺寸重新调整为数位板宽度(约760像素左右).如果网站的设计是平板电脑大小(约760像素)，那么我只想显示两列产品.

By default the page displays 3 wide, which looks fine until the browser window re-sizes down to tablet width (760px or so). When the website's design is tablet size (760px or so) I would like to display only two columns of products.

要执行此操作，似乎必须使用javascript确定窗口宽度，然后根据浏览器窗口的宽度运行一些php代码...

To do this, it seems one must use javascript to determine the window width, then run some php code depending on the browser-window width... like

这个...

    if ( browser-window-widith > 760) { get '3-column.php' }
    else { get '2-column.php' }

这太过简单了. 该代码逻辑是什么样的?一个人怎么写这个功能?

This is grossly over-simplified. What would this code logic look like? How would one write this functionality?

此外，可以将初始if语句更改为:

Also, one could change the initial if statement to:

    if (browser-window-width < 760) { get '2-column.php' }
    else { get '3-column.php' }

==================================

====================================

将存在两个.php文件(2-column.php和& 3-column.php) 每个都包含:

There would exist two .php files (2-column.php, & 3-column.php) Each contains:

    <?php $this->setColumnCount(2); ?>

或

    <?php $this->setColumnCount(3); ?>

根据浏览器窗口的宽度(该代码将由javascript找到)，代码将调用一个文件或另一个文件，从而导致

The code would call one file or another depending on the browser window width, (which would be found by the javascript) and thus result in

用于显示> 760px的3列产品列表

3-column product list for displays > 760px

和

用于显示的2列产品列表< 760px

2-column product list for displays < 760px

推荐答案

我在我的网站登录页面上使用此功能:

if(!isset($_GET['width']))
    {
        echo '<script type="text/javascript">window.location = "' . $_SERVER['PHP_SELF'] . '?width="+screen.width+"&height="+screen.height;</script>';
    }
    else
        {
            $_SESSION['screen_width'] = $_GET['width'];
            $_SESSION['screen_height'] = $_GET['height'];
        }

现在，宽度和高度已保存到当前会话中，我可以在显示页面划分之前进行条件检查.

if($_SESSION['screen_width']>= '1400')
   {
      $this->setColumnCount(3);
   }
   else
       {
          $this->setColumnCount(2);
       }

这篇关于使用jQuery确定浏览器宽度，然后调用一个(两个).php文件(来自同一目录)以加载一行PHP的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！