Seiyria的bootstrap-slder.js在WordPress中不起作用

时间:2017-04-29 作者:Ashiqur Rahman

bootstrap-slider.js 由不在WordPress工作的seiyria提供。资源文件似乎链接不正确。我错过了什么?有什么想法吗?

将资源链接到WordPress(functions.php):

if (!function_exists(\'techcare_enqueue_scripts\')):
function techcare_enqueue_scripts() {

    /*  Enqueue Scripts Begin */

    wp_deregister_script(\'jquery\');
    wp_enqueue_script(\'jquery\', get_template_directory_uri().
        \'/scripts/jquery-2.1.4.js\', false, null, false);

    wp_deregister_script(\'modernizr\');
    wp_enqueue_script(\'modernizr\', get_template_directory_uri().
        \'/scripts/modernizr.min.js\', false, null, false);

    wp_deregister_script(\'classie\');
    wp_enqueue_script(\'classie\', get_template_directory_uri().
        \'/scripts/classie.js\', false, null, false);

    wp_deregister_script(\'api\');
    wp_enqueue_script(\'api\', \'https://www.google.com/recaptcha/api.js\', false, null, false);

    wp_deregister_script(\'script-1\');
    wp_enqueue_script(\'script-1\', \'https://maps.googleapis.com/maps/api/js?key=AIzaSyBJPGck9G3Pf4f912F_NyyEPFU9mOroxKo&callback=initMap\', false, null, false);

    wp_deregister_script(\'script-2\');
    wp_enqueue_script(\'script-2\', \'https://maps.googleapis.com/maps/api/js?sensor=false\', false, null, false);

    wp_deregister_script(\'jquery\');
    wp_enqueue_script(\'jquery\', get_template_directory_uri().
        \'/scripts/jquery-2.1.4.js\', false, null, true);

    wp_deregister_script(\'jquerymagnificpopup\');
    wp_enqueue_script(\'jquerymagnificpopup\', get_template_directory_uri().
        \'/scripts/jquery.magnific-popup.min.js\', false, null, true);

    wp_deregister_script(\'smoothscroll\');
    wp_enqueue_script(\'smoothscroll\', get_template_directory_uri().
        \'/scripts/SmoothScroll.js\', false, null, true);

    wp_deregister_script(\'apscrolltop\');
    wp_enqueue_script(\'apscrolltop\', get_template_directory_uri().
        \'/scripts/ap-scroll-top.js\', false, null, true);

    wp_deregister_script(\'bootstrapdatepicker\');
    wp_enqueue_script(\'bootstrapdatepicker\', get_template_directory_uri().
        \'/scripts/bootstrap-datepicker.min.js\', false, null, true);

    wp_deregister_script(\'bootstrap\');
    wp_enqueue_script(\'bootstrap\', get_template_directory_uri().
        \'/scripts/bootstrap.min.js\', false, null, true);

    wp_deregister_script(\'wow\');
    wp_enqueue_script(\'wow\', get_template_directory_uri().
        \'/scripts/wow.min.js\', false, null, true);

    wp_deregister_script(\'main\');
    wp_enqueue_script(\'main\', get_template_directory_uri().
        \'/scripts/main.js\', false, null, true);

    wp_deregister_script(\'jquerycounterup\');
    wp_enqueue_script(\'jquerycounterup\', get_template_directory_uri().
        \'/scripts/jquery.counterup.min.js\', false, null, true);

    wp_deregister_script(\'waypoints\');
    wp_enqueue_script(\'waypoints\', get_template_directory_uri().
        \'/../cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.3/waypoints.min.js\', false, null, true);

    wp_deregister_script(\'slick\');
    wp_enqueue_script(\'slick\', get_template_directory_uri().
        \'/scripts/slick.min.js\', false, null, true);

    wp_deregister_script(\'jqueryvalidate\');
    wp_enqueue_script(\'jqueryvalidate\', get_template_directory_uri().
        \'/scripts/vendor/jquery-validation/jquery.validate.min.js\', false, null, true);

    wp_deregister_script(\'jqueryvalidateunobtrusive\');
    wp_enqueue_script(\'jqueryvalidateunobtrusive\', get_template_directory_uri().
        \'/scripts/vendor/jquery-validation/jquery.validate.unobtrusive.min.js\', false, null, true);

    wp_deregister_script(\'ajaxhandler\');
    wp_enqueue_script(\'ajaxhandler\', get_template_directory_uri().
        \'/scripts/ajaxhandler.js\', false, null, true);


    wp_deregister_script(\'script-3\');
    wp_enqueue_script(\'script-3\', \'https://maps.googleapis.com/maps/api/js?key=AIzaSyBJPGck9G3Pf4f912F_NyyEPFU9mOroxKo&callback=initMap\', false, null, false);

    wp_deregister_script(\'script-4\');
    wp_enqueue_script(\'script-4\', \'https://maps.googleapis.com/maps/api/js?sensor=false\', false, null, false);

    wp_deregister_script(\'bootstrapslider\');
    wp_enqueue_script(\'bootstrapslider\', \'https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.2/bootstrap-slider.js\', false, null, false);

    wp_deregister_script(\'bootstrapslider\');
    wp_enqueue_script(\'bootstrapslider\', \'https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.2/bootstrap-slider.min.js\', false, null, false);

    /*  Enqueue Scripts End */

    /*  Enqueue Styles Begin */

    wp_deregister_style(\'bootstrap\');
    wp_enqueue_style(\'bootstrap\', get_template_directory_uri().
        \'/css/bootstrap.min.css\', false, null, \'all\');

    wp_deregister_style(\'bootstrapdatepicker\');
    wp_enqueue_style(\'bootstrapdatepicker\', get_template_directory_uri().
        \'/Css/bootstrap-datepicker3.css\', false, null, \'all\');

    wp_deregister_style(\'fontawesome\');
    wp_enqueue_style(\'fontawesome\', get_template_directory_uri().
        \'/css/font-awesome.css\', false, null, \'all\');

    wp_deregister_style(\'animate\');
    wp_enqueue_style(\'animate\', get_template_directory_uri().
        \'/css/animate.css\', false, null, \'all\');

    wp_deregister_style(\'effect\');
    wp_enqueue_style(\'effect\', get_template_directory_uri().
        \'/css/effect1.css\', false, null, \'all\');

    wp_deregister_style(\'style\');
    wp_enqueue_style(\'style\', get_template_directory_uri().
        \'/css/style.css\', false, null, \'all\');

    wp_deregister_style(\'responsive\');
    wp_enqueue_style(\'responsive\', get_template_directory_uri().
        \'/css/responsive.css\', false, null, \'all\');

    wp_deregister_style(\'rotate\');
    wp_enqueue_style(\'rotate\', get_template_directory_uri().
        \'/css/rotate.css\', false, null, \'all\');

    wp_deregister_style(\'normalize\');
    wp_enqueue_style(\'normalize\', get_template_directory_uri().
        \'/css/normalize.css\', false, null, \'all\');

    wp_deregister_style(\'set\');
    wp_enqueue_style(\'set\', get_template_directory_uri().
        \'/css/set1.css\', false, null, \'all\');

    wp_deregister_style(\'pricing\');
    wp_enqueue_style(\'pricing\', get_template_directory_uri().
        \'/css/pricing.css\', false, null, \'all\');


    wp_deregister_style(\'bootstrapslider\');
    wp_enqueue_style(\'bootstrapslider\', \'https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.2/css/bootstrap-slider.css\', false, null, \'all\');

    wp_deregister_style(\'bootstrapslider\');
    wp_enqueue_style(\'bootstrapslider\', \'https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.2/css/bootstrap-slider.min.css\', false, null, \'all\');

    wp_deregister_style(\'intltelinput\');
    wp_enqueue_style(\'intltelinput\', get_template_directory_uri().
        \'/countryCode/css/intlTelInput.css\', false, null, \'all\');


    /*  Enqueue Styles End */

}
add_action(\'wp_enqueue_scripts\', \'techcare_enqueue_scripts\');
endif;
将资源链接到WordPress(部分代码):

wp_deregister_script( \'bootstrapslider\' );
wp_enqueue_script( \'bootstrapslider\', \'https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.2/bootstrap-slider.js\', false, null, false);

wp_deregister_script( \'bootstrapslider\' );
wp_enqueue_script( \'bootstrapslider\', \'https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.2/bootstrap-slider.min.js\', false, null, false);

wp_deregister_style( \'bootstrapslider\' );
wp_enqueue_style( \'bootstrapslider\', \'https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.2/css/bootstrap-slider.css\', false, null, \'all\');

wp_deregister_style( \'bootstrapslider\' );
wp_enqueue_style( \'bootstrapslider\', \'https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.2/css/bootstrap-slider.min.css\', false, null, \'all\');
以下是HTML部分:

<input id="web" data-slider-id=\'web\' type="text" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="0" />
JQuery部分:

        // With JQuery
        $("#web").slider();
        $("#web").on("slide", function(slideEvt) {
        $("#webVal").text(slideEvt.value);
        $("#web1Val").text(\'$\'+slideEvt.value);
        $("#web2Val").text(\'$\'+slideEvt.value*10);
        $("#looking").text(\'a Web\');
        });
这是演示页面link.

2 个回复
SO网友:cjbj

我看了你的页面。代码一团糟,到处都是html错误。在上面的问题代码中,您对脚本文件进行了四次排队和出列,因此它在页眉中只出现一次。在页面正文中,您还将对其进行四次硬加载。

在正文的一半包含的脚本没有考虑到这一点WordPress loads jquery in nonconflict mode, 意味着您不能使用$ 选择器。后者可能是滑块无法工作的主要原因,但我建议您也平滑其余代码。

SO网友:Ashiqur Rahman

我需要在之后添加脚本代码

<?php wp_footer(); ?>
<scripts> //js code here </scripts>
第节。那就好了。