1

我正在使用 onpropertychange 事件来检测用户键入时对文本框的更改（即在框失去焦点之前）。这是有效的，但是当我使用代码设置文本框值时似乎出现了一个错误。这样做会导致 onpropertychange 事件触发，这是应该的，但是用户对文本框进行的下一次更改不会导致事件触发。但是，下一次更改后的更改确实会触发事件，并且它会继续正常工作，直到再次使用代码设置文本框值。

重现步骤：

1) 添加 onpropertychange 事件作为文本框 HTML 元素的属性，或使用 DOM。(document.form.TextboxName.onpropertychange = myHandler) 2) 观察 onpropertychange 事件在文本框更改时触发 3) 使用代码设置文本框值 (document.form.TextboxName.value = "New value") 4) 观察这会导致触发事件 5) 使用键盘更改文本框值（插入后者、退格或删除等） 6) 观察这次没有触发任何事件 7) 再次使用键盘更改文本框值。事件继续正常触发

首先，我想确认这确实是一个 IE 错误，我的代码不应该受到责备。我也在寻找有关如何解决此问题的建议。我想跟踪对文本框值的所有更改。其他事件（例如 onkeydown）都受到限制，因为它们不会检测到修改值的非键盘方法。这只需要在 IE 8 中工作。

编辑：下面的代码。在我家的浏览器（IE9）上运行，所述问题不会发生。然而 IE9 出现了一个错误，退格键根本不会触发 onpropertychange 事件！将模式切换到 IE8 标准（按 F12 并选择浏览器模式）会导致代码按照本文所述运行（事件会触发，直到使用代码设置控件的文本值，在这种情况下，输入的下一个字符不会触发事件。）

<!doctype html>
<html>
<head>
<script type="text/javascript" language="javascript">

var changingValue = false;

function onpropchange(){
    if (window.event.propertyName == "value" && !changingValue) {
        // Do stuff here
        alert("Changed via user input");
    }
}

function setTextBoxValue(val) {
    var textBox = document.getElementById("foo");
    changingValue = true;
    textBox.value = val;
    changingValue = false;
}

window.changeValue = function() {
    setTextBoxValue("NEW VALUE");
}

</script>

</head>
<body>

<input id="foo" onpropertychange="onpropchange();">
<input type="button" value="change value" onclick="changeValue()">


</body>
</html>
4

1 回答 1

0

这个使用 JQuery 对我有用：

$('#foo').focus().val(val).blur();

或者

var textBox = document.getElementById("foo");
textBox.focus();
textBox.value = val;
textBox.blur();

这个想法是在更改值之前首先关注焦点，然后在代码更改值之后移除焦点。下次用户按键时，onpropertychange 将触发。

于 2013-10-09T02:24:29.080 回答