当readonly为true时，TextBox的Fire onchange事件

Question

我正在尝试更改一个只读文本框的功能。 但是当我尝试使用javascript更新文本框时，更改事件不会触发文本框。

<script type="text/javascript">
        $(document).ready(function () {
            $('input[id$=_txtTest]').bind("change", function () {
                alert("test");
            });
                        });
        function ChangeText() {
            $('input[id$=_txtTest]').val('hello');
         }
    </script>

我在点击按钮时调用ChangeText方法。但它没有触发文本框的textchange事件。

有人可以告诉我这里有什么问题吗？

Answer 1

你必须这样做：http://jsfiddle.net/kmvSV/1/

 $(document).ready(function () {
   $('input[id$=_txtTest]').bind("change", function () {
     alert($(this).val());
   });
   $('button').bind("click", function () {
     $('input[id$=_txtTest]').val('hello').trigger('change');
   });
 });

Answer 2

更改事件由真实用户事件触发，而不是javascript操作。

您可以触发更改事件，如下所示：

$('input[id$=_txtTest]').val('hello').change();

Answer 3

你可以这样做

function setValueOfTextBox()
{
    var myElement = document.getElementById("textboxid");
    myElement.value = "hello";
    //following code fire change event for you text box
    if (myElement.onchange) 
         myElement.onchange();
}

Answer 4

我认为出于某种安全原因，事件不会被触发。 但是您可以通过触发该元素上的特定事件来实现。 例如。 $('input[id$=_txtTest]').trigger('change');

我希望这对某人有帮助。

Answer 5

onkeypress 事件 或 several other events 之一：

由于只读字段并没有真正改变； onChange 事件没有 触发它。然而;您可以收听several other events。

这是一个简短的演示：

input {
  font-size: 16px;
  line-height: 30px;
  padding: 3px;
  border: 2px darkblue solid;
}

<script>
function sayHi(evt) {

  alert('Are you tyring to edit a read-only? Click OK for details.')
  alert(JSON.stringify({
    keyCode: evt.keyCode, 
    charCode: evt.charCode, 
    altKey:evt.altKey, 
    ctrlKey: evt.ctrlKey, 
    shiftKey: 
    evt.shiftKey
  }), null, 2);
}
</script>



<input onkeypress="sayHi(event);" readonly placeholder="A readonly field..." />