如何通过文件unctions.php正确加载这个jQuery脚本?

时间:2017-02-11 作者:Altcoin Factory

我正在尝试包含并正确加载脚本goo。gl/QlJxbk在这个wordpress网站上。我跟踪了医生http://webtechfreaky.github.io/Cloud-Pricing-Slider/docs/index.html 要正确加载脚本,但正如您所看到的,某些内容无法正常工作/加载。如文档中所述,脚本有两列,右列加载正确,左列未加载,预设选择器停止工作,价格不符等等。

我所做的是:将脚本文件夹加载到文件夹主题中,然后将CSS和脚本排队到文件函数中。使用以下命令创建主题的php:

对于样式//定价滑块样式

    wp_enqueue_style( \'jquery-ui-full-style\', get_template_directory_uri() . \'/layout/assets/css/jquery-ui.min.css\' , array(), \'\', \'all\' );
    wp_enqueue_style( \'qs-slider-style\', get_template_directory_uri() . \'/layout/assets/css/slider.min.css\' , array( \'jquery-ui-full-style\' ), \'\', \'all\' );
对于脚本//定价滑块脚本

        wp_enqueue_script( \'jquery-1.11.0\', get_template_directory_uri() . \'/layout/assets/js/jquery-1.11.0.min.js\', array(), \'\', true );
        wp_enqueue_script( \'jquery-ui\', get_template_directory_uri() . \'/layout/assets/js/jquery-ui.js\', array(), \'\', true );
        wp_enqueue_script( \'jquery-ui-min\', get_template_directory_uri() . \'/layout/assets/js/jquery-ui.min.js\', array(), \'\', true );
        wp_enqueue_script( \'qs.slider.init\', get_template_directory_uri() . \'/layout/assets/js/qs.slider.init.js\', array(), \'\', true );
        wp_enqueue_script( \'qs.slider\', get_template_directory_uri() . \'/layout/assets/js/qs.slider.js\', array(), \'\', true );
可能存在冲突,或者数组没有正确声明,我真的无法判断这里出了什么问题。非常感谢您的帮助,谢谢。

1 个回复
SO网友:user6552940

您不需要包括jquery-uijquery-ui.min 其中任何一个都足够了。而且jqueryjquery-ui 已包含在WordPress中。

试试这个

wp_enqueue_script( \'jquery\');   
wp_enqueue_script( \'jquery-ui-core\');   
wp_enqueue_script( \'qs.slider\', get_template_directory_uri() . \'/layout/assets/js/qs.slider.js\', array(\'jquery\',\'jquery-ui-core\'), \'\', true );    
wp_enqueue_script( \'qs.slider.init\', get_template_directory_uri() . \'/layout/assets/js/qs.slider.init.js\', array(\'jquery\',\'jquery-ui-core\'), \'\', true );
以上代码将确保jqueryjquery-ui 在加载滑块之前加载

加载样式,就像您正在做的那样

请注意,仅加载这些文件本身不会做任何事情。您需要实际使用此滑块作者提供的HTML标记,请参阅this 源代码。并根据需要自定义滑块,然后添加到自定义页面。