无论我如何编写，jQuery 文档都无法正常工作答案

【问题标题】：jQuery document ready will not work no matter how I write it无论我如何编写，jQuery 文档都无法正常工作
【发布时间】：2015-05-18 20:04:17
【问题描述】：

我觉得这应该是一件很容易解决的事情，但我就是无法让它发挥作用。我正在使用谷歌地图运行 jQuery 商店定位器脚本。该脚本需要两个 javascript 文件 jquery 和 google maps api。最后，它调用实际函数来运行定位器。文件如下：

jlocator.min.js
jplist.min.js
jlocator.activate.js (this is where is put the document.ready script)
jquery
google api script

我的定位器在非 wordpress 测试站点中工作得非常好。但是在 Wordpress 中，商店定位器脚本根本不会运行。这是在我的functions.php页面中

function my_map_scripts() {
    if ( is_page_template( 'template-project-map.php' ) ) {
        wp_enqueue_script(
            'jplist-custom-script',
            get_stylesheet_directory_uri() . '/js/jplist.min.js',
            array( 'jquery' )
        );
        wp_enqueue_script(
            'jlocator-custom-script',
            get_stylesheet_directory_uri() . '/js/jlocator.min.js',
            array( 'jquery' )
        );
        wp_enqueue_script(
            'jlocator-activate-script',
            get_stylesheet_directory_uri() . '/js/jlocator.activate.js',
            array( 'jquery' )
        );
        wp_enqueue_script(
                'google-maps',
                'https://maps.googleapis.com/maps/api/js'
            );
    }
}

add_action( 'wp_enqueue_scripts', 'my_map_scripts' );

我已将 .js 文件排入队列，它们加载正常。我在每个文件中都放了警报只是为了仔细检查。我还曾一度使用 wp_script_is 来确保 jQuery 正在运行。

问题似乎出在我的文档就绪代码中。我正在使用以下内容：

jQuery(document).ready(function(){
    jQuery('#jlocator').jlocator();
});

这无济于事。我什至尝试发出警报，看看是否可行：

jQuery(document).ready(function(){
    jQuery('#jlocator').jlocator();
    alert("activated");
});

再一次，什么都没有。但如果我删除这一行：

jQuery('#jlocator').jlocator();

所以代码如下：

jQuery(document).ready(function(){
        alert("activated");
    });

警报触发正常。我也尝试做类似下面的代码只是为了看看它是否可以工作，但它也没有工作。（.panel 是我页面上的一个 div）。

jQuery(document).ready(function(){
    jQuery('.panel').hide();
});

不过，上面的代码在我的非 Wordpress 测试站点中运行良好。似乎每当我使用以下代码做某事时，它都会关闭其他所有内容。

jQuery('sometext')....

我在这里缺少什么简单的东西吗？

另外，我尝试将文档编写为：

$(document).ready(function(){
    $('#jlocator').jlocator();
    alert("activated");
});

和

jQuery(document).ready(function($){
    $('#jlocator').jlocator();
    alert("activated");
});

但仍然没有任何效果。任何建议将不胜感激。

【问题讨论】：

控制台出错？听起来jlocator() 方法未定义
我检查了错误控制台，我看到关于 Google Maps API 多次出现在页面上的几个错误。我以为它可能来自其他地图插件，但它们都已停用。而且我知道我只调用过一次 Google Maps API。此外，即使我删除了对 jlocator() 的调用，如果我用 jQuery('.panel').hide() 之类的东西替换它，那也不起作用。当我在行首使用 jQuery 时没有任何效果。
您必须先修复错误才能让您的代码正常工作。也就是说，如果jQuery('.panel').hide(); 不起作用，那么在你调用它的时候可能没有这个类的元素。也许jQuery 以某种方式被覆盖（？！）。也许，等等......如果没有看到复制您问题的简约样本，就不可能为您提供更多帮助。
我刚刚使用全新安装的 Wordpress 再试一次。这次jQuery('.panel').hide() 确实有效，但我仍然没有看到地图。在错误控制台中，我得到以下信息： TypeError: jQuery(...) is not a function。此错误出现两次（它在我的每个 javascript 文件中）。它指的是像这样的行jQuery(function(k){var.......... 我是否必须以任何方式更改我的 javascript 文件（类似于 $ 必须更改为 jQuery 的方式？我不知道从哪里开始显示代码的最小示例. 唯一给我一个问题的部分是对 locator() 的调用
你必须在这些插件之前包含 jQuery

标签： javascript jquery wordpress google-maps document-ready

【解决方案1】：

问题现在解决了。出于某种原因，jQuery 没有加载，即使我在调用我的 js 文件之前在我的函数中设置了一个依赖项。我不确定为什么会这样。但我将以下代码添加到我的 functions.php 页面，它开始工作：// Load jQuery if ( !is_admin() ) { wp_deregister_script('jquery'); wp_register_script('jquery', ("https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"), false); wp_enqueue_script('jquery'); }

【讨论】：