Question

所以我根据三种情况构建了相当多的需要加载的脚本：

桌面
移动
移动全站（移动版桌面版）

我有一个yepnope函数，用于测试移动浏览器（使用http://detectmobilebrowsers.com/）加载jQuery Mobile和其他一些脚本文件（如果为true）和特定非移动脚本文件（如果为false）。但是，我注意到它强制将这些文件加载到Modernizr上面，这意味着它在jQuery之前加载。

如果用户想要查看桌面版本，我还有一个只能从移动设备设置的cookie。如果设置了cookie，它将忽略上述脚本。

所以基本上我只是想弄清楚实施这些条件的最佳方法。

所有版本都需要jQuery，各种各样的库和主要版本脚本文件。
桌面版（和移动版全网站）还需要 jQuery UI和非移动脚本文件。
移动版需要jQuery Mobile，但不需要jQuery UI 作为一些额外的库和另一个特定的脚本文件移动。

我想我应先检查jQuery.browser.mobile然后检查是否为真检查cookie。问题是我在脚本条件中插入PHP语句时出现问题。它看起来像这样：

if(jQuery.browser.mobile) {

    if(<?php if($_POST['dontDoMob']) { return true; } ?>) {
        // Mobile full site scripts
    } else {
        // Mobile scripts
    }

} else {
    // Desktop scripts
}

我还想象上面的脚本必须作为yepnope加载jQuery的完整函数运行。

有谁能让我知道这种情况的正确技术？

作为一个附带问题，将jQuery Mobile和jQuery UI加载到一起真的是不好的做法吗？前者是否意味着在移动平台上复制后者（在某些方面）？加载jQuery UI只是浪费时间吗？

更新（请参阅下面的评论）：

我决定使用以下技术来检测四种类型的设备/设备状态;桌面，手机，平板电脑和桌面网站在手机上（phonefull）。使用伟大的Mobile Detect 类。

require_once 'Mobile_Detect.php';

$detect    = new Mobile_Detect;
$desktop   = false;
$phone     = false;
$tablet    = false;
$phonefull = false;
$class     = '';

if( $detect->isMobile() && !$detect->isTablet() ) {
    if($_COOKIE['dontDoMob']) {
        $phonefull = true;
        $class = 'phonefull';
    } else {
        $phone = true;
        $class = 'phone';
    }
} else if( $detect->isTablet() ) {
    $tablet = true;
    $class = 'tablet';
} else {
    $desktop = true;
    $class = 'desktop';
}

?>

class变量会回显到<body>标记中，以便在CSS和JavaScript中使用。

然后使用设备变量，只需执行正常的PHP if语句：

<link rel="stylesheet" href="css/main.css">
<?php if($phone) { ?>
<link rel="stylesheet" href="css/mobile.css">
<?php } ?>

正确的脚本加载技术与yepnope

0 个答案: