WordPress入队脚本混乱(jQuery&Foundation.js)

时间:2012-02-09 作者:Matt

在过去的几天里,我一直在努力构建一个主题,但我遇到了一堵墙。而我最初包括基金会。js作为一个排队脚本,我不记得为什么要添加它。今天,当我试图从我的函数中删除它(以提高页面加载速度)时。php文件,它弄乱了我所有的jQuery插件。

经过一些研究,我发现Foundation已经包含了jQuery,所以我一次加载了它的两个实例(我也从主题的js文件夹加载)。所以,现在我已经移除了基础,我的习惯。除非我在前面加上“jQuery”而不是更简单的“$”,否则js文件命令不起作用。

我想我的Wordpress安装中有一部分是我发现了漏洞的,即使我将“Foundation”名称引用保留在前面调用的jQuery文件中,主题仍然有效。就好像它必须有一个“基金会”的名字。

下面,我包括了我的脚本调用和自定义js文件,希望有人能帮助我诊断这个问题。

链接:

-Chrome Console Error Message

-jQuery & Plugins shown loading in Chrome Console

脚本调用:

function register_js() {
if (!is_admin()) {
    wp_deregister_script(\'jquery\');
    wp_deregister_script(\'foundation\');
    wp_register_script(\'jquery\', get_template_directory_uri() . \'/js/libraries/jquery-1.7.1.min.js\');
    wp_register_script(\'jquery-ui\', get_template_directory_uri() . \'/js/libraries/jquery-ui-1.8.16.min.js\', \'jquery\');
    wp_register_script(\'superfish\', get_template_directory_uri() . \'/js/plugins/jquery.superfish.js\', \'jquery\');
    wp_register_script(\'supersubs\', get_template_directory_uri() . \'/js/plugins/jquery.supersubs.js\', \'jquery\');
    //wp_register_script(\'foundation\', get_template_directory_uri() . \'/js/plugins/jquery.foundation.js\', \'jquery\');
    wp_register_script(\'custom\', get_template_directory_uri() . \'/js/custom.js\', array(\'jquery\',\'jquery-ui\') );
    wp_enqueue_script(\'jquery\');
    wp_enqueue_script(\'jquery-ui\');
    wp_enqueue_script(\'superfish\');
    wp_enqueue_script(\'supersubs\');
    //wp_enqueue_script(\'foundation\');
    wp_enqueue_script(\'custom\');
}
}
add_action(\'init\', \'register_js\');
自定义JS文件:

$(document).ready(function() {

/* Menu - Superfish */
$(\'ul.menu\').supersubs({ 
    minWidth:    11,
    maxWidth:    30,
    extraWidth:  1    
}).superfish({ 
    hoverClass: "sfHover", 
    speed: \'fast\', 
    dropShadows: false, 
    delay: 0,
    autoArrows: false,
    animation: {height:\'show\',opacity:\'show\'}
});

/* Blog Tabs */
$(\'#tab_controls\').tabs({ fx: [ {opacity:\'toggle\', duration:\'normal\'},{opacity:\'toggle\', duration:\'slow\'}] }); 

});

2 个回复
最合适的回答,由SO网友:turbonerd 整理而成

尝试更改自定义JS文件的第一行。

jQuery(document).ready(function($) {

在WordPress中操作的jQuery应该在兼容模式下运行。根据第5点,该线允许发生这种情况here.

SO网友:Chip Bennett

首先,如果您的主题打算公开发布,do not deregister core-bundled scripts and replace them with your own. 这包括jQuery、jQuery UI和several other scripts.

其次,是的:WordPress使用jQuery no conflict运行,这意味着您必须说明脚本中没有冲突。The Codex-recommended method is here:

jQuery(document).ready(function($) {
    // $() will work as an alias for jQuery() inside of this function
});
这两项可能与您的问题无关,但都是最佳做法:

如果同时调用wp_register_script()wp_enqueue_script() 在相同的上下文/函数中,只需省略wp_register_script(), 和使用wp_enqueue_script().wp_enqueue_scripts, 而不是init.

结束

相关推荐

如何将JQuery UI插件包含到WordPress中并在插件形式中正确地将其列队?

我编写了一个基本的管理顶层插件,它有一个子菜单,驱动一个php表单,其中有一个从wp\\U数据库填充的网格表(来自其中的自定义表“分支”)。我的安装是WAMPServer上的一个干净的WP 3.3.1。只有在2010年和2011年主题的头文件中,才在中包含wp\\u head函数之前的更改。我尝试使用JQuery文档。“ready”不起任何作用。所以我假设我有一个Jquery设置问题。如有任何建议/帮助,将不胜感激。(我也尝试过使用JQueryUI对话框-模式-表单,但zilch、nada等也会在页面中显