检测更改的input文本框
我看了很多其他的问题，发现了非常简单的答案，包括下面的代码。 我只是想检测当有人改变文本框的内容，但由于某种原因，它不工作…我没有控制台错误。 当我在change（）函数的浏览器中设置一个断点时，它从来没有碰到它。 整页的代码如下：
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="DatabaseAssociation.aspx.vb" Inherits="projectname.DatabaseAssociation" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link href="add.css" rel="stylesheet" type="text/css" /> <script src="../JS/jquery-1.5.1.min.js" type="text/javascript"></script> <script src="../JS/jquery-ui-1.8.13.custom.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function () { $('#inputDatabaseName').change(function () { alert('test'); }); }); </script> </head> <body> <form id="form1" runat="server"> <div> <input id="inputDatabaseName"> <table id="searchResults"><tr><td>empty</td></tr></table> </div> </form> </body> </html> 你可以像使用jQuery一样使用oninput事件：
$('#inputDatabaseName').on('input',function(e){ alert('Changed!') });
在纯JavaScript中
document.querySelector("input").addEventListener("change",function () { alert("Input Changed"); })
或者像这样：
<input id="inputDatabaseName" onchange="youFunction();" onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();"/>
尝试键入而不是改变。
<script type="text/javascript"> $(document).ready(function () { $('#inputDatabaseName').keyup(function () { alert('test'); }); }); </script>
这里是.keyup（）的官方jQuery文档 。
每个答案都错过了一些观点，所以这里是我的解决scheme：
$("#input").on("input",function(e){ if($(this).data("lastval")!= $(this).val()){ $(this).data("lastval",$(this).val()); //change action alert($(this).val()); }; });
此事件触发键盘input和鼠标拖动和自动填充和粘贴在Chrome和Firefox上testing。 它检测到真正的变化，而不是再次粘贴同样的东西时发射或！
工作示例： http : //jsfiddle.net/g6pcp/473/
更新：
如果您只想在用户input完成后运行change function ，则可以尝试以下操作：
var timerid; $("#input").on("input",function(e){ var value = $(this).val(); if($(this).data("lastval")!= value){ $(this).data("lastval",value); clearTimeout(timerid); timerid = setTimeout(function() { //change action alert(value); },500); }; });
如果用户开始input（例如“foobar”），这段代码将阻止您的change action针对每个用户types的字母运行，并且仅在用户停止input时运行，这尤其适用于将input发送到服务器（例如searchinput） ，这样的服务器只有一个searchfoobar而不是六个searchf然后fo然后foo和foob和…
看看这里： http : //jsfiddle.net/xstqLkz4/2/
当浏览器对文本框执行自动填充时onkeyup, onpaste, onchange, oninput似乎失败。 要处理这种情况，请在文本框中包含“ autocomplete='off' ”以防止浏览器自动填充文本框，
例如，
<input id="inputDatabaseName" autocomplete='off' onchange="check();" onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();" /> <script> function check(){ alert("Input box changed"); // Things to do when the textbox changes } </script>
文本input不会触发change事件，直到失去焦点。 点击input之外，将显示警报。
如果在文本input失去焦点之前应该触发callback，请使用.keyup()事件。
在我的情况下，我有一个附加到dateselect器的文本框。 我唯一的解决scheme是在datepicker的onSelect事件中处理它。
<input type="text" id="bookdate"> $("#bookdate").datepicker({ onSelect: function (selected) { //handle change event here } });
我想你也可以使用keydown：
$('#fieldID').on('keydown', function(e){ //console.log(e.which); if( e.which === 8 ){ //do something when pressing delete return true; } else { //do something else return false; } });
