input经常用的事件有oninput与onchange
oninput:事件在用户输入时触发。
onchange:事件在内容改变(两次内容有可能还是相等的)且失去焦点时触发
但是当我们给元素赋值时并不会触发上面的2种事件,如果我们想赋值后触发上面的事件,可以采用下面的方法
一、js 实现方法
<input type="text" id="demo" onchange="txtChange(this)" />
<script type="text/javascript">
var element = document.getElementById("demo")
//element.focus();
element.value = "this is sun222"
//txtChange() 如果只是赋值后执行一个函数,只要调用函数即可
if (element.fireEvent) {
element.fireEvent('onchange');
} else {
ev = document.createEvent("HTMLEvents");
//event.initEvent(eventType,canBubble,cancelable)
//eventType:字符串值,事件的类型
//canBubble:事件是否冒泡
//cancelable:是否可以用preventDefault()方法取消事件
ev.initEvent("change", false, true);
element.dispatchEvent(ev);
}
function txtChange(a) {
alert(a.value);
}
</script>
二、jQuery实现方法
<input type="text" id="demo" />
$(document).ready(function() {
$("#demo").change(function() {
alert("hi")
})
//$("#demo").val("this is lily").change() 此种方法可以,下面的方法也可以
$("#demo").val("this is lily111")
$("#demo").trigger("change")
})