jQuery和WordPress的 - 脚本不工作(jQuery and Wordpress - S

我试着去实现一些jQuery的一个插件，WP，我创造。

在我的主题的functions.php我有以下代码：

function load_jquery() {

    // only use this method is we're not in wp-admin
    if ( !is_admin() ) {

        // deregister the original version of jQuery
        wp_deregister_script('jquery');
        wp_deregister_script('jquery-ui-slider');
        wp_deregister_style('jquery-ui-style');


        // discover the correct protocol to use
        $protocol='http:';
        if($_SERVER['HTTPS']=='on') {
            $protocol='https:';
        }

        // register the Google CDN version
        wp_register_script('jquery', $protocol.'//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', false, '1.10.2');
        wp_register_script('jquery-ui-slider', $protocol.'//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js', false, '1.10.3');
        wp_register_style('jquery-ui-style', $protocol.'//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css', false );

        // add it back into the queue
        wp_enqueue_script('jquery');
        wp_enqueue_script('jquery-ui-slider');
        wp_enqueue_style('jquery-ui-style');
    }
}

add_action('wp_enqueue_scripts', 'load_jquery');

然后，在插件文件I输出通过功能和ADD_ACTION（“wp_head”，“functions_name”）以下中的一个;

echo '
<script type="text/javascript">

  jQuery(function($) {
    $( "#slider-range" ).slider({
      range: true,
      min: 0,
      max: 500,
      values: [ 75, 300 ],
      slide: function( event, ui ) {
        $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
      }
    });
    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
      " - $" + $( "#slider-range" ).slider( "values", 1 ) );
  });
</script>';

不过没有什么作品，即使我可以看到实际的脚本之前加载了jQuery。

有任何想法吗？ 如果我跳过themefile的header.php文件里面的wp_enqueue_script部分和过去的一切它的工作原理。

Answer 1:

你应该换你的脚本jQuery(document).ready(function($)因为jQuery对象可加载，但你需要的jQuery UI的脚本为好。

<script type="text/javascript">
jQuery(document).ready(function($){
    $( "#slider-range" ).slider({
      range: true,
      min: 0,
      max: 500,
      values: [ 75, 300 ],
      slide: function( event, ui ) {
        $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
      }
    });
    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
      " - $" + $( "#slider-range" ).slider( "values", 1 ) );
});
</script>';

Answer 2:

最大的问题是，以WordPress的冲突局势您的脚本工作，你需要更换你在jQuery的使用与“jQuery的”所有“$”符号。 每一个好的wordpress主题开发知道这一点，所以你需要适应WordPress的与您的代码冲突。

例如：

   jQuery(document).ready(function($){
        jQuery( "#slider-range" ).slider({ 
            etc etc 
        )};
       )};

我希望IM对的，因为我有同样的问题，这样做，它解决了。 :)

文章来源: jQuery and Wordpress - Scripts not working