初始化bootstrap datepicker后调用noConflict()?

时间:2014-12-10 18:13:39

标签: javascript jquery twitter-bootstrap jquery-ui bootstrap-datepicker

我正在尝试使用noConflict()和bootstrap datepicker来避免与其他jquery插件冲突。

bootstrap datepicker docs说:

$.fn.datepicker.noConflict provides a way to avoid conflict with other jQuery datepicker plugins:

var datepicker = $.fn.datepicker.noConflict(); // return $.fn.datepicker to previously assigned value
$.fn.bootstrapDP = datepicker;                 // give $().bootstrapDP the bootstrap-datepicker functionality

但这对我不起作用,因为我在日期范围内使用它。代码的作者有this to say

  

糟糕!日期范围代码本身调用.datepicker,所以你是对的,   当与noConflict结合时,它就会被打破。

     

目前,我建议在 初始化范围后调用noConflict   选择器。

但我该怎么做?

我试过了:

$('#bookingform .input-daterange').datepicker({
    ...options excluded for brevity...
});
datepicker = $.fn.datepicker.noConflict();  

我试过这个:

$('#bookingform .input-daterange').datepicker({
    ...options excluded for brevity...
}).noConflict();

但我似乎无法让它发挥作用。任何人都可以告诉我我做错了什么(或者最好是我能做得对吗?)

更新:对于那些询问我如何初始化范围选择器的人:

似乎没有专门调用此代码的代码。除了下面的演示代码,它依赖于bootstrap js。我认为范围方面可能基于班级.input-daterange,但我不确定。

这是演示代码:

<div class="input-daterange input-group" id="datepicker">
    <input type="text" class="input-sm form-control" name="start" />
    <span class="input-group-addon">to</span>
    <input type="text" class="input-sm form-control" name="end" />
</div>

$('#sandbox-container .input-daterange').datepicker({
    format: "dd/mm/yyyy"
});

1 个答案:

答案 0 :(得分:1)

您的第一次尝试是完全遵循所有者的指示。 这是src中发生的地方:https://github.com/eternicode/bootstrap-datepicker/blob/master/js/bootstrap-datepicker.js#L1357-L1392

代码不会异步执行任何操作,因此在下一行调用.noConflict应该已经完成​​了插件所有者的建议。

但是,从源头看,似乎无论什么错误导致您的原始问题现在已经修复。 .datepicker不再在DateRangePicker类中调用。