用滑块停止jQuery冲突

时间:2013-06-27 09:02:30

标签: jquery

我使用下面的脚本显示时间滑块。该脚本在除主页之外的所有页面上都能正常工作,因此我认为它与某些内容存在冲突。该网站在Magento中运行,我能想到的唯一区别是主页上名为flex-slider的模块。

我在jQuery中添加了没有冲突,但时间滑块仍然不起作用。

<script type="text/javascript">
jQuery.noConflict();
jQuery(function() {
  jQuery('#callback_selected').html("9 am");
  var select = jQuery( "#callback" );
  var slider = jQuery( "<div id='slider'></div>" ).insertAfter( select ).slider({
    min: 1,
    max: 12,
    range: "min",
    value: 1,
    step: .5,
        slide: function (event, ui) {
        $time_int = ui.value;
        if (ui.value < 5) {
            $time_int = $time_int + 8;
            if ($time_int.toString().substr(-2) == '.5') $time_int = $time_int.toString().split('.')[0] + ":30";
            $time_selected = $time_int + " am";
        } else {
            $time_int = $time_int - 4;
            if ($time_int.toString().substr(-2) == '.5') $time_int = $time_int.toString().split('.')[0] + ":30";
            $time_selected = $time_int + " pm";
        }
      jQuery('#callback_selected').html($time_selected);
      jQuery("#time").val($time_selected);
    }
  });
});
</script>

1 个答案:

答案 0 :(得分:0)

jQuery.noConflict();当你同时或在同一页面中使用(并加载)其他库时,会使用supposse。

如果您使用noConflict,则必须在您的函数中使用相同的格式。

注意区别是dolar符号和jQuery字:

jQuery.noConflict();
// Do something with jQuery
jQuery("div p").hide();
// Do something with another library's $()
$("content").style.display = 'none';

所以...对于你的代码,我会将所有$更改为jQuery字,这必须是没有问题的。 (然后,可以删除noConflict) 当然,必须在文档就绪时调用jQuery函数(或至少是推荐的)。


如果您想保留$别名,另一个选项是将所有jQuery替换为$符号,但将noConflict call替换为:

jQuery.noConflict();
(function($) {
  $(function() {
    // code using $ as alias to jQuery
  });
})(jQuery);

请注意(function($){...

中的美元

在这种情况下,$jQuery的别名,但请记住在该函数中始终使用$


  

最后,我在现实世界中的过期和最佳实践,是使用 allways jQuery字......然后没有必要在没有冲突的情况下战斗   在大多数情况下。 (因为他们通常使用$签名)


更多示例和说明:http://api.jquery.com/jQuery.noConflict/

祝你好运!