jquery改变不起作用的动态值变化

在jQuery中,如果textbox的值从其他事件动态变化,我如何跟踪onchange事件。 我尝试了这个,但它不起作用:

 $("#txtbox").change(function(){ alert("change"); }); 

keyup不包括所有自然情况:(

changekeyup不起作用的两种情况:

  • 浏览器表单自动完成机制
  • 从系统剪贴板执行鼠标粘贴。

示例:form具有用于将电子邮件地址放入其中的文本框,并且onchange上附加了keyup事件。

当用户开始键入电子邮件地址时,如果弹出Chrome或Firefox自动完成框并且用户单击其中一个选项,则该框将填充该值,焦点保留在文本框中(因此没有更改事件触发)并且未按任何键(没有键盘事件)。 我尝试将click附加到列表中,但它会在我的浏览器中引起奇怪的行为。

与粘贴类似 – 如果鼠标用于粘贴(通过右键单击可用的上下文菜单)),则不会触发keyup和change事件。

任何人都有一个完整的解决方案,即如何处理输入值的实际变化?

我一直在寻找这样的解决方案,在没有用户需要离开元素的情况下触发,但这适用于所有情况,包括Jakub在他的post中发现的情况。 即

  • 正常打字
  • 通过鼠标粘贴
  • 自动完成

理想情况下我也想要一个jQuery解决方案,因为我使用了各种jQuery选择器等,并且不希望“解开”我的jQuery对象到DOM元素的麻烦。

我使用3个不同的事件触发器寻求解决方案 – 请参阅下面的代码示例中的注释,了解原因:

 var valuechanged = function () { // do something }; var inputtowatch = $('.selector'); inputtowatch.on('input', valuechanged); inputtowatch.on('keyup', valuechanged); // input event is buggy and doesn't catch delete/backspace in IE, but can't just use keyup alone as that doesn't catch paste and automcomplete inputtowatch.on('propertychange', valuechanged); // input event not supported in IE < 9 

我希望使用这样的多个事件可能会导致函数被多次触发。 在我在Firebug中的测试中,没有发生这种情况。 然而,如果函数运行“太多”次,我没有意识到这一点是幸运的,因此没有进一步测试这个特定方面(例如其他浏览器)。

我同意Jakub P.

我尝试使用Jquery来处理文件输入类型的文件的更改(以预览上传的图像),但它不会像普通的旧javascript onchange事件那样触发。

我改变了在$(document).ready()附加事件处理程序的方式

从:

 $("#iconImage").bind("change", function(event) { ChangeImage("iconImage", "iconImagePreview"); }); 

至:

 var obj = document.getElementById("logoImage"); obj.onchange = function() { ChangeImage("logoImage", "#logoImagePreview"); }; 

我得到了我希望的行为。

仅在元素失去焦点时才会触发change事件。 请改用keyup事件。