无法在 wordpress 管理员中触发任何 jquery - 没有显示错误答案

【问题标题】：Can't get any jquery to fire in wordpress admin - no errors showing无法在 wordpress 管理员中触发任何 jquery - 没有显示错误
【发布时间】：2014-01-29 11:02:52
【问题描述】：

我正在为我的 cms 使用 wordpress，并且我正在使用这个很棒的插件 Advanced Custom Fields 将一些自定义字段添加到我的管理员中。

在我的管理员中，一切正常，我使用的是最新的 wordpress 3.8

好的，所以我只想添加一些 jquery 来与我的帖子管理中的选择下拉列表进行交互。此选择下拉菜单由ACF plugin 生成。

ACF 为您提供了一个简单的钩子，可以将脚本和 css 添加到管理面板的头部。 See hook documentation here.

原来是这样……

// WEATHER DATA ICON
function hrc_weather_type_field_icon()
{
    ?>
    <style type="text/css">

        body { display: none !important }   

    </style>

    <script type="text/javascript">
    (function($){



    })(jQuery);
    </script>
    <?php
}
add_action('acf/input/admin_head', 'hrc_weather_type_field_icon');

以上工作正常。如果我查看源代码，我可以看到上面的标记出现在我的<head>

好的，但如果我这样做......

// WEATHER DATA ICON
function hrc_weather_type_field_icon()
{
    ?>
    <style type="text/css">



    </style>

    <script type="text/javascript">
    (function($){

        $('body').empty();

    })(jQuery);
    </script>
    <?php
}
add_action('acf/input/admin_head', 'hrc_weather_type_field_icon');

我仍然可以在我的源代码<head> 中看到这个标记，但是脚本没有触发！！！

并且控制台中没有错误或警告，页面上需要脚本的所有内容都正常工作。

显然我不希望我的<body> 被清空，我只是在测试基本的 API 以实际触发脚本。

下面的脚本是我最初尝试的脚本，但我认为是脚本本身的问题，但后来意识到它实际上不可能有问题后，我开始测试其他基本的jquery API，如.hide， .remove，等等，实际上什么都没有触发！！！

// WEATHER DATA ICON
function hrc_weather_type_field_icon()
{
    ?>
    <style type="text/css">

        /* ... */

    </style>

    <script type="text/javascript">
    (function($){

        $("#acf-field-weather_data_weather").on('change', 'select', function() {
            alert( "Handler for .change() called." );
        });

    })(jQuery);
    </script>
    <?php
}
add_action('acf/input/admin_head', 'hrc_weather_type_field_icon');

如果有人对为什么会发生这种情况有任何见解，我会非常感激，因为它让我发疯了：-P

谢谢

【问题讨论】：

标签： jquery wordpress advanced-custom-fields

【解决方案1】：

您已创建范围，但缺少文档就绪处理程序：

(function($){
  $(function(){  //<------this is the doc ready
     $('body').empty();
  });
})(jQuery);

【讨论】：

很高兴这对您有所帮助。
你真的帮了大忙。不敢相信就这样把我抓了。谢谢！！！
好吧，我们就是这样做的...:)

【解决方案2】：

尝试使用 jQuery 的noConflict()。

<script type="text/javascript">
var j = jQuery.noConflict();
j(document).ready(function($) {

    j("#acf-field-weather_data_weather").on('change', 'select', function() {
        alert( "Handler for .change() called." );
    });

});
</script>

【讨论】：

谢谢你，我先测试了它，我得到了可以工作的脚本，但是 Jai 的回答很有效，我想我可能对 functon doc 准备好而不是 doc 准备好感到困惑。无论如何感谢您的帮助