无法使用Google CDN正确入队jQuery

时间:2012-09-04 作者:Dominor Novus

问题是:

我了解如何在函数中定期将jQuery UI排队。php。

我的问题是,我使用的是默认情况下WordPress没有附带的selectmenu小部件:

http://wiki.jqueryui.com/w/page/12138056/Selectmenu

...只有在我使用以下命令将jQuery排入队列时,它才起作用:

    wp_enqueue_script( 
   \'uicore\', 
   \'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js\', 
    array(\'jquery\') 
);
这与日期选择器没有冲突,但只要我调用jQuery UI按钮,页面上的所有jQuery元素都会中断。

实例:

按钮、selectmenu和datepicker协同工作的测试示例:http://www.dominornovus.com/jquery-test-environment/

调用按钮中断所有jQuery元素的实际示例:http://www.dominornovus.com/killyliss-country-house/test/

代码:

    //wp_enqueue_script(\'jquery-ui-datepicker\');
    //wp_enqueue_script(\'jquery-ui-button\');
    //wp_enqueue_style( \'uicss\', \'http://dominornovus.com/wp-content/themes/killylisscountryhouse/jquery/custom-theme/custom-killyliss.css\' );
    //wp_enqueue_script( \'uisel\', \'http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/ui.selectmenu.js\' );
    //wp_enqueue_style( \'uicss2\', \'http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/ui.selectmenu.css\' );

add_action(\'wp_enqueue_scripts\',\'enq_menu_scripts_and_styles\');

function enq_menu_scripts_and_styles() {
    // UI Core, loads jQuery as a dependancy

    wp_enqueue_script( 
       \'uicore\', 
       \'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js\', 
        array(\'jquery\') 
    );

    // jQuery
    //wp_enqueue_script( \'jquery\', \'//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"\' );

    // jQuery UI
    //wp_enqueue_script( \'jqueryui\', \'//ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js\' );

    // UI Theme CSS
    //wp_enqueue_style( \'uicss\', \'http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css\' );
    wp_enqueue_style( \'uicss\', \'http://dominornovus.com/wp-content/themes/killylisscountryhouse/jquery/custom-theme/custom-killyliss.css\' );

    // Datepicker JS
    //wp_enqueue_script(\'jquery-ui-datepicker\');
    //wp_enqueue_script( \'uidate\', \'http://jquery-ui.googlecode.com/svn/branches/1.7.3/ui/ui.datepicker.js\' );

    // Button JS
    //wp_enqueue_script(\'jquery-ui-button\');
    //wp_enqueue_script( \'uibutton\', \'http://jquery-ui.googlecode.com/svn/branches/1.7.3/ui/ui.button.js\' );

    // Selectmenu JS
    wp_enqueue_script( \'uisel\', \'http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/ui.selectmenu.js\' );

    // Selectmenu CSS
    wp_enqueue_style( \'uicss2\', \'http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/ui.selectmenu.css\' );

}
任何帮助都将不胜感激。

1 个回复
最合适的回答,由SO网友:Tomas Buteler 整理而成

您的测试很可能因为冲突而被破坏。实际上,您正在加载所有UI脚本的两个版本。这是因为JQuery UI的Google CDN版本not the core, 但是整个脚本库(包括datepicker、autocomplete等)与WordPress脚本相反,WordPress脚本被分解成多个片段,当位于管理区域内时,这些片段往往会连接在一起。

这意味着,如果包含Google版本,则不必将所有UI脚本单独排队。它们只会起作用。先试试这个。

如果您发现其他东西(WP、插件、主题中的元素)正在将WP的默认脚本排队并导致问题,您可以尝试将导致冲突的脚本排出来(只需查看测试页面的底部:它们都在那里)。或者您可以尝试用CDN脚本替换WP脚本,as stated in the Codex.

// Deregister first, then register again with new source, and enqueue
wp_deregister_script(\'jquery-ui-core\');
wp_register_script(\'jquery-ui-core\', \'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js\');
wp_enqueue_script(\'jquery-ui-core\');
这里的问题是依赖性。您可能必须对其他UI脚本执行此操作,才能使其按预期工作。

最后不能不提I hear WP 3.5 has the latest versions of UI included by default (1.8.23截至今日)。虽然我不能说如果使用今天可用的3.5-alpha,就不会有其他问题,但您可能不会遇到脚本排队冲突。

结束

相关推荐

JQuery主题滚轮到WordPress

如何将Jquery ui的自定义滚动主题加载到wordpress?我最近为datepicker创建并下载了一个新主题,但无法加载。我尝试将css文件添加到我的主题文件中,然后执行“排队风格”功能,但似乎遗漏了一些东西。function my_add_styles() { wp_enqueue_style(\'datepicker\', get_template_directory_uri() . \'/lib/js/datepicker.css\'); }