我想检测文本框的内容何时发生了变化。我可以使用keyup方法,但这也将检测不生成字母的击键,如方向键。我想到了两种使用keyup事件的方法:
显式检查所按键的ascii码是否为字母\backspace\delete 使用闭包来记住在击键之前文本框中的文本是什么,并检查这是否已更改。
两者看起来都有点麻烦。
我想检测文本框的内容何时发生了变化。我可以使用keyup方法,但这也将检测不生成字母的击键,如方向键。我想到了两种使用keyup事件的方法:
显式检查所按键的ascii码是否为字母\backspace\delete 使用闭包来记住在击键之前文本框中的文本是什么,并检查这是否已更改。
两者看起来都有点麻烦。
当前回答
我假设当文本框发生变化时,您希望做一些交互式的事情(即通过ajax检索一些数据)。我在寻找同样的功能。我知道使用全局变量不是最健壮或最优雅的解决方案,但我就是这么做的。这里有一个例子:
var searchValue = $('#Search').val();
$(function () {
setTimeout(checkSearchChanged, 0.1);
});
function checkSearchChanged() {
var currentValue = $('#Search').val();
if ((currentValue) && currentValue != searchValue && currentValue != '') {
searchValue = $('#Search').val();
$('#submit').click();
}
else {
setTimeout(checkSearchChanged, 0.1);
}
}
这里需要注意的一件关键事情是,我使用的是setTimeout而不是setInterval,因为我不想同时发送多个请求。这确保计时器在提交表单时“停止”,在请求完成时“启动”。当我的ajax调用完成时,我通过调用checkSearchChanged来做到这一点。显然,你可以展开它来检查最小长度,等等。
在我的例子中,我使用的是ASP。Net MVC,所以你可以看到如何将其与MVC Ajax结合在一起,以及在下面的帖子中:
http://geekswithblogs.net/DougLampe/archive/2010/12/21/simple-interactive-search-with-jquery-and-asp.net-mvc.aspx
其他回答
我想问你为什么要检测文本框的内容在实时改变?
另一种方法是设置一个计时器(通过setIntval?),并将上次保存的值与当前值进行比较,然后重置计时器。这将保证捕捉任何变化,无论是由键、鼠标、其他你没有考虑到的输入设备引起的,甚至是JavaScript从应用程序的不同部分改变值(另一种没有人提到的可能性)。
在HTML/标准JavaScript中使用onchange事件。
在jQuery中这就是change()事件。例如:
$('element').change(function() {// do something});
EDIT
看了一些评论后,你觉得:
$(function() {
var content = $('#myContent').val();
$('#myContent').keyup(function() {
if ($('#myContent').val() != content) {
content = $('#myContent').val();
alert('Content has been changed');
}
});
});
“change”事件不能正常工作,但“input”是完美的。
$('#your_textbox').bind('input', function() {
/* This will be fired every time, when textbox's value changes. */
} );
我假设当文本框发生变化时,您希望做一些交互式的事情(即通过ajax检索一些数据)。我在寻找同样的功能。我知道使用全局变量不是最健壮或最优雅的解决方案,但我就是这么做的。这里有一个例子:
var searchValue = $('#Search').val();
$(function () {
setTimeout(checkSearchChanged, 0.1);
});
function checkSearchChanged() {
var currentValue = $('#Search').val();
if ((currentValue) && currentValue != searchValue && currentValue != '') {
searchValue = $('#Search').val();
$('#submit').click();
}
else {
setTimeout(checkSearchChanged, 0.1);
}
}
这里需要注意的一件关键事情是,我使用的是setTimeout而不是setInterval,因为我不想同时发送多个请求。这确保计时器在提交表单时“停止”,在请求完成时“启动”。当我的ajax调用完成时,我通过调用checkSearchChanged来做到这一点。显然,你可以展开它来检查最小长度,等等。
在我的例子中,我使用的是ASP。Net MVC,所以你可以看到如何将其与MVC Ajax结合在一起,以及在下面的帖子中:
http://geekswithblogs.net/DougLampe/archive/2010/12/21/simple-interactive-search-with-jquery-and-asp.net-mvc.aspx
你考虑使用变化事件吗?
$("#myTextBox").change(function() { alert("content changed"); });