如何在Wordpress的functions.php中编写Javascript函数？

Question

我正在修改开发人员推荐（See latest post）的插件，建议在Wordpress的functions.php中编写一些Javascript。

现在，当我这样做时，我的整个wordpress都空白了。好吧，经过一番思考......“你不能在PHP中编写简单的Javascript”..

所以我在<script>标记内写了这些标记，并在echo "，";标记内写了这些标记。现在..我不确定该功能是否有效（尚未测试），但Wordpress再次显示，但是......我收到了消息

  

注意：未定义的变量：第8行的/home/appelhulp/domains/appelhulp.nl/public_html/wp-content/themes/Divi/functions.php中的分组
  注意：未定义的变量：第9行/home/appelhulp/domains/appelhulp.nl/public_html/wp-content/themes/Divi/functions.php中的选项
  注意：未定义的变量：第25行/home/appelhulp/domains/appelhulp.nl/public_html/wp-content/themes/Divi/functions.php中的选项

这是代码文件

所以我的问题：
有什么问题，如何让这些消息消失？

正确答案

虽然我接受了@Burak的答案，但这只是正确答案的一半。另请参阅@ RahilWazir的部分，他/她的答案的一半属于解决方案。当Burak带来正确的剧本时，RahilWazir提出将其置于footer.php而不是functions.php的建议。把它放在那里，就可以了。在functions.php我没有让我实现我所寻求的目标。因此，谢谢两位！

Answer 1

在wordpress中有更好的标准方法

<?php
function add_js_functions(){
?>
<script>
// your js functions here 
</script>
<?php
}
add_action('wp_head','add_js_functions');

Answer 2

当您使用双引号时，PHP会认为带有$的变量标记为php变量。您需要将它们更改为单引号并重新排列代码，您需要查看适合此类情况的heredoc。

echo <<<'EOT'
<script>
( function() {
    var categories = {};
    var $group = jQuery();
    jQuery('select.app_select_services option').remove().each(function() {
        var $option = jQuery(this),
            contents = $option.text().split(' - '),
            group = jQuery.trim(contents[1]);

        if (!categories.hasOwnProperty(group)) {
            var optGroup = jQuery('<optgroup />', { label: group });
            optGroup.appendTo('select.app_select_services');
            categories[group] = optGroup;
        }

        categories[group].append(jQuery('<option />', {
            text: jQuery.trim(contents[0]),
            value: jQuery(this).val()
        }));
    });
} )();
</script>
EOT;

Answer 3

您需要等待DOM完全初始化。因此，将您的jQuery代码段包装在ready处理程序中。或者更好的地方是在关闭footer.php代码之前将此代码段放在</body>文件中。

jQuery(document).ready(function($) { // <-- wrap it
    var categories = {};
    var $group = jQuery();
    jQuery('select.app_select_services option').remove().each(function() {
        var $option = jQuery(this),
            contents = $option.text().split(' - '),
            group = jQuery.trim(contents[1]);

        if (!categories.hasOwnProperty(group)) {
            var optGroup = jQuery('<optgroup />', { label: group });
            optGroup.appendTo('select.app_select_services');
            categories[group] = optGroup;
        }

        categories[group].append(jQuery('<option />', {
            text: jQuery.trim(contents[0]),
            value: jQuery(this).val()
        }));
    });
});

Answer 4

当您使用双引号""来定义JS字符串时，PHP会将$group解释为变量。为了解决这个问题，您需要使用单引号''。