jquery 检测文本框值更改不是基于用户输入

Question

假设您的页面上有一个简单的文本框和按钮。单击该按钮将更新文本框值：

超文本标记语言：

<input type="text" id="myText" val="" />
<input type="button" id="myBtn" value="Change TextBox Value" />

jQuery:

$("#myBtn").on('click', function() {
   $("#myText").val('adsf');
})

我想为文本框的更改事件添加一个事件侦听器，如下所示：

$('#myText').on('change', function(){
    alert('Changed!')
});

当您单击按钮时，该警报不会触发，但当您手动更改文本框值并将其焦点移出时，该警报会被触发。

我知道你可以将$（“#myText”）.trigger（'change'）添加到按钮的onclick事件中，但我希望只通过在文本框中添加事件侦听器来实现这一点。

jsfiddle

谢啦

Answer 1

您需要连接两个处理程序。要重用处理程序，可以将其提取到一个命名函数中:

function showChanged(){
    alert('Changed!')
}

$("#myBtn").on('click', showChanged);
$("#myText").on('change', showChanged);

Answer 2

为什么不在单击按钮时强制手动事件 -

$('#myText').on('change',function(e){
    alert('Changed!');
});

$("#myBtn").on('click', function() {
    $("#myText").val('adsf');
    $("#myText").change();
})

Answer 3

不支持此类事件。您唯一可以尝试的是设置间隔或超时以检查值是否已更改（使用数据存储临时值）：

var $myText = $("#myText");

$myText.data("value", $myText.val());

setInterval(function() {
    var data = $myText.data("value"),
        val = $myText.val();

    if (data !== val) {
        $myText.data("value", val);
        alert("changed");
    }
}, 100);

演示:http://jsfiddle.net/xZcAr/1/