JQuery clockpicker不会在输入时触发更改事件

时间:2016-03-03 15:01:17

标签: javascript jquery jquery-plugins

在代码库中,我正在处理这种类型的回调绑定,只要有任何输入发生变化就会发生某些事情

$(document.body).on('change', '.input-sm', function (){
 ...
})

问题是,一些输入短信通过时钟选择器改变,这不会触发“改变”。事件。我怎么做这个工作?理想情况下,我喜欢clockpicker来触发更改事件。

http://jsfiddle.net/4zg3w5sj/7/

编辑:回调被同时使用clockpickers绑定到多个输入,所以我不能使用输入变量来触发更改事件(除非我明确地迭代输入,我猜)

1 个答案:

答案 0 :(得分:3)

你可以使用clockpicker回调

  

beforeHourSelect:在用户发出之前触发的回调函数   小时选择

     

afterHourSelect:用户发出后触发的回调函数   小时选择

     

beforeDone:在写入时间之前触发回调函数   输入

     

afterDone:在将时间写入输入后触发回调函数

input.clockpicker({
    autoclose: true,
    afterDone: function() {
       input.trigger("change");       
    }
});

我已经找到了问题

插件会触发更改事件,但是他们使用triggerHandler代替trigger,这意味着您无法在正文上添加侦听器,您必须直接侦听输入

// Hours and minutes are selected
    ClockPicker.prototype.done = function() {
        raiseCallback(this.options.beforeDone);
        this.hide();
        var last = this.input.prop('value'),
            value = leadingZero(this.hours) + ':' + leadingZero(this.minutes);
        if  (this.options.twelvehour) {
            value = value + this.amOrPm;
        }

        this.input.prop('value', value);
        if (value !== last) {
            this.input.triggerHandler('change');
            if (! this.isInput) {
                this.element.trigger('change');
            }
        }

        if (this.options.autoclose) {
            this.input.trigger('blur');
        }

        raiseCallback(this.options.afterDone);
    };

在这里看到一个修复

 var input = $('#input-a');
    var value = input.val();
    // bind multiple inputs
    $('.myinput').clockpicker({
        autoclose: true,
        afterDone: function() {
        console.log("test");
        }
    });

    // in the actual code it's not tied to an id but to a non-unique class
    // does not trigger if changed by clock-picker
    $(".myinput").on('change', function(){
        console.log("!!!!")
    })