javascript基础(十)JS事件(下)
今天复习下javascript的一些事件,上一节已经说了捕获和冒泡事件,这节主要来看看常见的事件,废话不多说,先截个图看看常见的事件http://dl.iteye.com/upload/attachment/617000/7788df43-127c-34e5-953e-007e4de36b0f.jpg
http://dl.iteye.com/upload/attachment/617004/eab6bb6d-1cbb-337f-9ae5-cd29c7c53bcc.jpg
我写了两个htmL文件 上源代码
<!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>javascript事件</title><script language="JavaScript" type="text/javascript"> function textChange(obj){ //alert(obj); var div=document.getElementById("inputDiv"); var value=obj.value; div.innerHTML=value;} function textChange2(obj){ var div=document.getElementById("inputDiv2"); var value=obj.value; div.innerHTML=value; }</script></head><body> onChange事件:<input type="text" id="input1" onchange="textChange(this)"/><div id="inputDiv"></div> onpropertyChange事件:<input type="text" id="input2" onpropertychange="textChange2(this)"/><div id="inputDiv2"></div> </body></html> <!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>javascript事件2</title><script language="JavaScript" type="text/javascript"> function cardOnFocus(obj){ var value=obj.value;if(value=="请输入格式:10XXXXXX"){obj.value="";} }function cardOnBlur(obj){ var value=obj.value;var pattern=/^10\d{6}$/;var result=pattern.test(value);if(!result){ alert("您输入的格式错误,重新输入！"); obj.focus();}else{ alert("格式输入正确！");} } </script></head><body> <form> <h2>卡号:<input type="text" id="inputCard"value="请输入格式:10XXXXXX" /></h2><br />密码:<input type="password" id="inputPass" value=""/> </form></body></html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML> <HEAD><TITLE> JavaScript中的事件（下） </TITLE><META NAME="Content-Type" CONTENT="text/html;charset=utf-8"><META NAME="Author" CONTENT=""><META NAME="Keywords" CONTENT=""><META NAME="Description" CONTENT=""><SCRIPT LANGUAGE="JavaScript"><!--function pageOnLoad(){var xDiv=document.getElementById("positionX");var yDiv=document.getElementById("positionY");function documentMouseMove(ev){ev=ev||window.event;if(navigator.userAgent.indexOf("Firefox")!=-1){if(ev.pageX||ev.pageY){xDiv.innerHTML="<font color='red'>"+ev.pageX+"</font>";yDiv.innerHTML="<font color='red'>"+ev.pageY+"</font>";}}else{var x=ev.clientX+document.body.scrollLeft-document.body.clientLeft;var y=ev.clientY+document.body.scrollTop-document.body.clientTop;xDiv.innerHTML="<font color='red'>"+x+"</font>";yDiv.innerHTML="<font color='red'>"+y+"</font>";}}document.onmousemove=documentMouseMove;}//--></SCRIPT> </HEAD> <BODY >X:<div id="positionX"></div>Y:<div id="positionY"></div> </BODY></HTML>
页:
[1]