Bootstrap Datepicker 更改触发 3 次 [英] Bootstrap Datepicker on change firing 3 times

问题描述

我一直在尝试获取引导日期选择器的日期，并且已经能够获取，但它似乎触发了 3 次.注意:这不是 jquery 日期选择器，而是引导程序日期选择器.

Hi I have been trying to just get the date of a bootstrap date picker and have been able to but it seems to fires 3 times. NOTE: This is not jquery date picker but bootstrap date picker.

使用这个日期选择器:https://github.com/eternicode/bootstrap-datepicker，而不是旧的 eyecon.一个.

Using this date picker: https://github.com/eternicode/bootstrap-datepicker, not older eyecon.ro one.

 $(".date-picker").on("change", function(e) {
      contents = $(this).val();
      id = $(this).attr('id');
      console.log("onchange contents: " + contents);
      console.log("onchange id: " + id);

 });

HTML:

<input id="start_date" type="text" data-date-format="yyyy-mm-dd" class="date-picker form-control" />

除了更改之外，我还使用了其他一些选项，例如

I have used a few other options other than change, like

$('.date-picker').datepicker().change(function(){};

但这并没有关闭日期选择器，希望有一个简单的解决方案.谢谢

But this does not close date picker, hoping there is an easy solution to this. thx

推荐答案

它没有解决问题，但我使用日期选择器通过 ajax 帖子发送，所以 3 个更改事件给我带来了问题 - 第 3 个事件总是失败.即使文档说要使用 changeDate 事件，在我看来，触发 input 标签的 change 事件 3 次也是不对的.该值不会更改 3 次！

it does not fix the problem, but i was using the datepicker to send through an ajax post, so the 3 change events was causing me problems - the 3rd event always failed. even if the documentation says to use a changeDate event, it doesn't seem right to me to fire the input tag's change event 3 times. the value isn't changing 3 times!

我编写了一个简单的去抖动"函数来解决这个问题.没有解决问题 - 这是由于从小部件的 setValue(第 508 行)_setDate:(第 1048 行)和 setValue(第 508 行)(1.3.0 版)方法触发了多个更改事件.

I wrote a simple 'debounce' function to get around the problem. doesn't fix the issue - which is due to multiple change events being fired from the methods: setValue (line 508) _setDate:(line 1048) and setValue (line 508) (version 1.3.0) of the widget.

 var lastJQueryTS = 0 ;// this is a global variable.
 ....
 // in the change event handler...
    var send = true;
if (typeof(event) == 'object'){
    if (event.timeStamp - lastJQueryTS < 300){
        send = false;
    }
    lastJQueryTS = event.timeStamp;
}
if (send){
    post_values(this);
}

它非常简单，只需找到 j​​query '事件'，并确保忽略 300 毫秒窗口中的值.在我的测试中，这一切都发生在 30 毫秒左右.

it is pretty simple, just finds the jquery 'event', and makes sure that values in a window of 300ms are ignored. in my testing this all happened in 30 msec or so.

这篇关于Bootstrap Datepicker 更改触发 3 次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！