Wordpress 网站：尽管链接正确，但在某些移动/平板电脑浏览器上无法引用脚本答案

【问题标题】：Wordpress website: script fails to be referenced on certain mobile/tablet browsers despite proper linkingWordpress 网站：尽管链接正确，但在某些移动/平板电脑浏览器上无法引用脚本
【发布时间】：2023-03-07 16:06:01
【问题描述】：

作为一种好的做法，我通常会扫描已经提出的问题以找到解决问题的方法，但我已经用尽了所有关于这个问题的搜索。

简而言之：

我从头开始开发我的网站，然后转换为 wordpress 主题。在桌面上一切正常，调整大小的浏览器显示网站响应并调整样式以适应移动设备（也在移动设备上进行了测试，因此样式没有任何问题）。我在控制台上找不到任何错误，在台式机和移动设备上都找不到。

但是没有 javascript 函数在我拥有并测试我的网站的以下设备上运行：

三星 Galaxy Note 3：本机浏览器
Ipad (iOS 8.3)：在浏览器上测试：Safari 和 Atomic Lite

有趣的是，在我的三星 Galaxy 上，我下载了其他几个浏览器只是为了检查：

Adblock 浏览器
DebugBrowser（它有一个 javascript 控制台，我检查了错误：没有）。

我已经上传了我的网站进行测试，你可以在：http://efcotest.web-merchant.co.nz/看到它

是的，我知道在移动视图上显示幻灯片并不是很好的做法，但我打算将其删除，只是当我开始测试基本功能（主要是站点菜单）时，我发现 javascript 无法正常工作一切都按照上面的简介。

有帮助的人吗？

编辑： 好的，所以我使用 jsconsole.com 远程调试，发现调用我的 javascript 函数时出现未解决的引用错误。我已经在我的 Galaxy Note 的本机浏览器和 Ipad 上检查了这一点。相同的参考错误。

这是我的怀疑，现在确认我的脚本文件没有加载到这些特定设备的广告浏览器上。

我真的可以在这里使用一些帮助，因为我完全不知道为什么脚本无法加载，我已经按照 wordpress 要求在 functions.php 中正确注册和排队脚本，所以我看不到什么问题是。帮助任何人？

注意：我应该补充一下，它们是按照 jsconsole 的，例如 ->

未捕获的 ReferenceError： ShowMobileMenu 未定义

您好 Esha，感谢您的回复。这是我的functions.php，你会看到我正在排队我的脚本：

<?php

wp_enqueue_style( 'EFCOstyle', get_stylesheet_uri() );

wp_enqueue_scripts('jquery');

wp_register_script( 'Gf', 'http://efcotest.web-merchant.co.nz/wp-content/themes/EFCO/js/Generalfunctions.js', array('jquery'), false, false);

wp_enqueue_scripts('Gf');

remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );

?>

我刚刚在 chrome 桌面浏览器上检查过，是的，又出现了完全相同的问题（IIRC android 原生浏览器也是基于 chrome 的？）

更新：我已通过将我的 functions.php 修改为：

来解决 Chrome（桌面）中的错误：

<?php
function AddStyle() {

wp_enqueue_style( 'style', get_stylesheet_uri() );

} 

function Addscripts() {

wp_register_script('jquery310', 'https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js');
wp_register_script('Generalfunctions', get_template_directory_uri() . '/js/Generalfunctions.js', array( 'jquery' ));

wp_enqueue_script('jquery310');
wp_enqueue_script('Generalfunctions');

}

add_action( 'wp_enqueue_scripts', 'AddStyle' );
add_action( 'wp_enqueue_scripts', 'Addscripts' );

remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );

?>

然而问题在手机上依然存在，我完全无法理解为什么脚本文件无法被引用。

【问题讨论】：

标签： javascript wordpress mobile web

【解决方案1】：

您在上面分享的链接页面源代码如下。它调用函数 ShowMobileMenu。但是没有定义这个函数的脚本文件。这就是你引用错误的原因。

事实上，我在桌面 chrome 浏览器上遇到了参考错误。请检查您是否将定义这些函数的 JS 文件排入队列。你的主题是只入队 CSS 文件没有 JS 文件。

<div class = "MobileMenuWrap"><!--Mobile Menu Strip Wrap-->

        <div class = "MobileMenuIconWrap" onclick = "ShowMobileMenu()">

            <label for="MobileMenuIcon" id = "MobileMenuIcon_label">Site Menu</label>

            <div id = "Menu_Icon" class = "MobileMenuIcon">
            </div>

        </div>

【讨论】：

嗨，Esha，感谢您的回复。我已经用更多信息编辑了我的主要帖子，我已经包含了我的 functions.php 代码，非常感谢您的输入！
我在 Android 6 chrome 上浏览了您的网站主页，它运行良好。单击时会显示站点菜单，并且滑块也可以正常工作。可能是你忘记清除缓存了。
是的，android chrome 或 firefox 等都没有问题。问题出在android的库存浏览器和ipad上的浏览器上——>至少这个问题出在我测试过的设备上。似乎没关系，即使我手动将我的包含在模板 index.php 和/或 page.php 或 header.php 的标题中，它也绝对不会影响。

【解决方案2】：

好的所以经过几个小时的反复试验，我终于设法跟踪和跟踪问题并调试它 - 很好摆脱。

问题很简单：语法无效。当我幸运地得到脑电波从我的 html 中调用我的脚本时，这一点就暴露了：

jQuery.getScript("http://efcotest.web-merchant.co.nz/wp-content/themes/efco/js/generalfunctions.js", function(){

   alert("script loaded if you see this message, executed? Look around, observe!");

});

正如我所料，该消息从未在我的 android 本机浏览器上弹出，因此我继续使用 jsconsole 开始远程调试。上面的方法还好让 jsconsole 返回了一个更有意义的错误，这次实际指定了它发生的行：

.../js/generalfunctions.js?ver=4.7.5:736
Uncaught SyntaxError: Unexpected token >

原来我是这样做的：

if((Target => 0)...

代替：

if((Target >= 0)...

但即使上面的正确语法也不起作用，即脚本无法在麻烦的浏览器上加载，所以我尝试了这个：

if(((Target == 0) || (Target > 0)) && (Target ==(MaxSlides-1) || (Target < (MaxSlides-1))))

这确实奏效了。也许这只是浏览器部分关于大于等于运算符的解释问题，正如在其他浏览器上的测试中所清楚的那样，即使使用 => 也没有返回任何错误（我知道这是不正确的）。

无论如何，现在工作。希望这篇文章会有所帮助 - 如果有人遇到类似的问题。为此，我已经记录了进度。

【讨论】：