在onkeyup事件中更改值时,onchange事件不会触发

Question

概述:

我正在编写一个jquery插件,它将文本框转换为时间输入框.这意味着它允许用户以HH:MM格式输入时间.此过程的一部分是在正确的位置插入冒号(:).在keyup上,我检查用户是否键入了2个数字,如果是,则在输入的值后附加一个冒号.

问题:

这种方法工作正常,除非有人在文本框上应用插件但又希望有一个自定义onchange处理程序.当代码以编程方式更新文本框值时,此onchange处理程序不会触发,也不会在文本框失去焦点时触发.

我的理解:

我在这里猜,所以如果我错了请纠正我.

• 也许文本框有一个内部"_value" (用于区分公共值属性的下划线)字段,该字段在编辑开始之前保存文本框中的值.当焦点离开texbox时,JS引擎会检查文本框的当前值是否与文本框的当前值匹配"_value".如果它们不同,onchange则会触发该 事件.
• 也许使用常规本机击键的值更改不会"_value"仅修改 值,因此onchange会被触发.但也许通过JS做价值变动修改这两个值和"_value"等onchange事件不火？

解决方法:

模糊事件将触发,因为它与值无关.所以我可以从blur事件中明确地触发change事件.但是我不想这样做,因为它是一个hack并且打破了模糊和变化的语义.

相关链接:

我在SO上发现了几个相同问题的链接,但没有答案(恕我直言)提供了一个优雅或正确的解决方案.以下是我看到的一些内容:

• Javascript:在onkeyup事件中更改值时,onfire事件不会触发

• /sf/ask/1008760931/

• Javascript:"onchange"事件不能与"文本输入"对象中的"值"更改一起使用

简化代码:

$(document).ready(function () {
    $("input").keyup(function () {
        this.value = '*' + this.value;
        // this changes the value, but does not fire the onchange event
        // and it also does not fire it when the textbox loses focus.
        // blur fires though.
    });
    $("input").change(function () {
        alert('in change');
    });

    $("input").blur(function () {
        alert('in blur');
    });
});

小提琴:

http://jsfiddle.net/sajjansarkar/vHgst/4/

浏览器测试: IE8,10和Chrome.适用于FireFox(!!)(+1 Felix Kling)

Answer 1

您可以使用 jquery.trigger 以编程方式触发事件： http://jsfiddle.net/vHgst/5/

$(this).trigger('change');