onChange和onClick的区别
1、使用情景不同
OnChange经常用于select下拉列表选中后的内容发生改变时候触发
OnClick表示的是点击该控件时触发
2、含义不同
OnChange:当控件的内容发生改变时触发该事件
OnClick:点击该控件时触发
3、使用方式不同
onchange和onclick都是js方法
可以在标签元素上使用 <input onchange=""></input> <input onclick=""></input>
也可以 jsobject.onchange=function(){SomeJavaScriptCode};
change和click是jquery方法
$('').change(function({}))或者; $('').click(function({}))
扩展资料:
事件一、onclick(下面是静态注册单击事件示例)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>The event of script</title>
<script type="text/javascript">
function onclickEvent(){
alert("您点击了我 我是一个单击钮触发的事件并且此处由静态加载!!");
}
</script>
</head>
<body>
<input type="button" onclick="onclickEvent();" value="单击事件静态"/>
</body>
</html>
事件二 onchange 动态 和 静态 注册(内容发生改变事件)
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function onchangeFun(){
alert("静态注册的onchage事件 ");
}
alert("现在页面未加载但是男神下拉框 已经被静态绑定了onchange 改变事件");
// 页面加载完成之后
window.onload = function() {
// 1.通过id属性值获取第二个select标签对象 var selectObj = document.getElementById("select01");
// 2.通过标签对象.事件名 = function(){}
alert("现在页面加载完成 对女神下拉框动态注册onchange事件中");
selectObj.onchange = function() {
alert("这是动态创建的onchange事件 ");
}
}
</script>
</head>
<body>
请选择你心中的男神:
<select onchange="onchangeFun();">
<option selected="selected">刘德华</option>
<option>张学友</option>
<option>张国荣</option>
</select>
<br/>
请选择你心中的女神:
<select id="select01">
<option>李四</option>
<option selected="selected">张三</option>
<option>王五</option>
</select>
</body>
</html>
参考资料来源:百度百科-javascript
<select name=sel onchange="bao(this.options[this.options.selectedIndex].value)">
<option value="">请选择
<option value="1">Item 1
<option value="2">Item 2
<option value="3">Item 3
</select>
<script>
function bao(s)
{
txt.value+=s;
//选择后,让第一项被选中,这样,就有Change了。
document.all.sel.options[0].selected=true;
}
</script>
<textarea id=txt></textarea