Datepicker onSelect [重复]答案

【问题标题】：Datepicker onSelect [duplicate]Datepicker onSelect [重复]
【发布时间】：2012-03-01 21:35:08
【问题描述】：

我有一个输入 [date_caisse] 类：datepicker-inline AND id: [date_caisse]

我在所有网页上都初始化了这个函数：

function InitEvents () {

$('.datepicker-inline').datepicker({

    showButtonPanel: true,  /*added by oussama*/
    changeMonth: true, /*added by oussama*/
    changeYear: true, /*added by oussama*/
    firstDay: 1,
    dateFormat: 'yy-mm-dd',/*'dd/mm/yy'*/
    onSelect: function (dateText, inst) {
        //alert('select!');
        id = $(this).attr('id');
        parts = id.split('-');
        id2 = parts[parts.length -1];
        $('#datepicker-target-id-' + id2).val(dateText);
    }
});

}

我只想在当前页面上应用 onSelect，所以这是我做的：

$('#date_caisse').datepicker({

    onSelect: function (dateText, inst) {
        alert('select!');
    }
});

当我将 alert('select!'); 放在主 js 文件（在所有页面中调用）上时，它就起作用了！但是当我尝试通过当前文件触发操作时它不会。

也许，onSelect 不应该被调用两次。

那么，有人可以帮帮我吗？

谢谢，祝你有美好的一天！

【问题讨论】：

标签： jquery datepicker onselect

【解决方案1】：

您是否将您的第二个函数放在了 jquery 初始化块中？我的意思是，它应该看起来像

$(function(){
   $('#date_caisse').datepicker({
      onSelect: function (dateText, inst) {
         alert('select!');
      }
   });
});

编辑：

好的，我明白了。第一次初始化 datepicker 时，原始 dom 元素被标记为一个新的类添加，称为 hasDatepicker 以防止后续初始化/重新配置。我发现摆脱它的方法是在对日期选择器的配置进行任何修改之前删除该标记。因此：

$(function() {
   $('#date_caisse').removeClass('hasDatepicker');
   $('#date_caisse').datepicker({
       onSelect: function(dateText, inst) {
           alert('overridden!');
       }
   });
});

试一试！

【讨论】：

嗨，谢谢的回答。我试过你说的，但它不起作用。我想问题是我的函数 datepicker() 被调用了两次：当我从我所有页面上的通用脚本中删除 function InitEvents () 时，当前的 scipt 工作正常并触发警报。我该怎么办...
@Keyser_Soze：我编辑了我的答案，经过几次调查后我发现了问题。我还在jsFiddle 上发布了测试，但我认为 jsFiddle 有一些问题，因为他们现在搬到了云上：测试有效，但只要我将它保存在我的帐户上，它就不再存在了：/
完美答案！我在我的网站上试用它，它正在工作。感谢您的帮助，我真的很感激。
下面的“更完美”的答案 - 在这里找到stackoverflow.com/a/9806960

【解决方案2】：

注意：如果您设置了onSelect 选项，日期选择器不会触发元素的更改事件。

如果有任何机会您需要响应元素的change 事件，您需要记住在设置onSelect() 时自己触发更改事件，例如：

$(function(){
   $('#date_caisse').datepicker({
      onSelect: function (dateText, inst) {
         alert('select!');
         // Remember to fire the change event...
         if (inst.input) {
             inst.input.trigger('change');
         };
      }
   });
});

使用onSelect 的替代方法是绑定到日期选择器触发的dateSelected 事件。

【讨论】：