onchange事件是在客户端改变输入控件的值,比如一个textbox,会出发的这个事件。
onchange 在元素值改变时触发。
onchange 属性适用于:<input>、<textarea>以及 <select>元素。
语法:onchange="JavaScript代码"
例如
<script type="text/javascript">function upperCase(){
var x = document.getElementById("fname").value//获取input中的值
document.getElementById("fname").value = x.toUpperCase()//input中的值转换成大写。
}
</script>
<body>
<input type="text" id="fname" onchange="upperCase()" /></p> onchange设置为uppercase时间
</body>
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/htmlcharset=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/htmlcharset=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
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)