html <input type =“text”/> onchange事件不起作用
我正在尝试做一些实验。 我想要发生的是，每当用户input文本框中的东西时，它将显示在对话框中。 我使用onchange事件属性来实现它，但它不起作用。 我仍然需要按提交button来使其工作。 我读了关于AJAX，我正在考虑了解这一点。 我仍然需要AJAX使其工作或简单的JavaScript足够吗？ 请帮忙。
index.php
<script type="text/javascript" src="javascript.js"> </script> <form action="index.php" method="get"> Integer 1: <input type="text" id="num1" name="num1" onchange="checkInput('num1');" /> <br /> Integer 2: <input type="text" id="num2" name="num2" onchange="checkInput('num2');" /> <br /> <input type="submit" value="Compute" /> </form>
javascript.js
function checkInput(textbox) { var textInput = document.getElementById(textbox).value; alert(textInput); }
onchange只在控件模糊时触发。 尝试onkeypress 。
检查按键只是一个部分的解决scheme，因为可以使用鼠标点击来改变input字段的内容。 如果右键单击文本字段，则将剪切并粘贴可用于更改值而不进行按键操作的选项。 同样，如果启用了自动完成function，您可以左键单击到某个字段并获取之前input的文本的下拉列表，然后您可以使用鼠标单击从您的select中进行select。 按键陷印不会检测到这些types的更改。
可悲的是，没有发生立即报告变化的“变化”事件，至less据我所知。 但是，有一种解决scheme适用于所有情况：使用setInterval（）设置定时事件。
假设你的input字段有一个id和名字“city”：
<input type="text" name="city" id="city" />
有一个名为“城市”的全局variables：
var city = "";
添加到你的页面初始化：
setInterval(lookForCityChange, 100);
然后定义一个lookForCityChange（）函数：
function lookForCityChange() { var newCity = document.getElementById("city").value; if (newCity != city) { city = newCity; doSomething(city); // do whatever you need to do } }
在这个例子中，“city”的值每100毫秒检查一次，你可以根据你的需要进行调整。 如果你喜欢，使用一个匿名函数，而不是定义lookForCityChange（）。 请注意，您的代码甚至浏览器可能会为input字段提供初始值，因此您可能会在用户执行任何操作之前收到“更改”通知; 根据需要调整您的代码。
如果计时事件每隔十分之一秒出现一次，那么可以在input字段接收到焦点时启动定时器，并在模糊时终止它（使用clearInterval（））。 我不认为有可能在没有获得焦点的情况下改变input字段的值，所以以这种方式打开和closures定时器应该是安全的。
使用.on('input'...来监视jQuery 1.7及更高版本对input（paste，keyup等）的每一个变化。
对于静态和dynamicinput：
$(document).on('input', '.my-class', function(){ alert('Input changed'); });
仅对于静态input：
$('.my-class').on('input', function(){ alert('Input changed'); });
静态/dynamicJSFiddle示例： https ：//jsfiddle.net/op0zqrgy/7/
使用以下事件而不是“onchange”
- onkeyup(event) - onkeydown(event) - onkeypress(event)
onchange仅在用户提交input元素的更改时发生，大部分时间是元素失去焦点的时候。
如果你想要你的函数每次发生元素值的变化，你应该使用oninput事件 – 这比关键的up / down事件更好，因为值可以用用户的鼠标，即粘贴或自动填充等
阅读更多关于这里的变化事件
在这里阅读更多关于input事件
HTML5定义了一个oninput事件来捕获所有直接的更改。 这个对我有用。
首先，什么“不起作用”？ 你没有看到警报？
另外，你的代码可以简化为这个
<input type="text" id="num1" name="num1" onkeydown="checkInput(this);" /> <br /> function checkInput(obj) { alert(obj.value); }
我遇到了Safari没有在文本input字段上触发“onchange”事件的问题。 我使用了一个jQuery 1.7.2“更改”事件，它也没有工作。 我结束了使用ZURB的textchange事件。 它可以和mouseevents一起工作，并且不用离开字段就可以触发：
http://www.zurb.com/playground/jquery-text-change-custom-event
$('.inputClassToBind').bind('textchange', function (event, previousText) { alert($(this).attr('id')); });
尝试使用onpropertychange 。 它只适用于IE。
