是: JavaScr事件处理程序 口 JavaScript事件处理程序就是一组语句,在事件(如点击 鼠标或移动鼠标等)发生时执行 事件处理程序的基本语法是: 事件名=" JavaScript代码或调用函数 例如: <| NPUT type= BUTTON"…. on Click=“aler(“单击我!”);"> | NPUT type= BUTTON”…. on MouseDown=“ check() 表示鼠标按下时,将调用执行函数 check()。 ACCP V4.0
ACCP V4.0 6 JavaScript 事件处理程序 ❑ JavaScript 事件处理程序就是一组语句，在事件（如点击 鼠标或移动鼠标等）发生时执行 事件 处理事件 事件处理程序的基本语法是： 事件名=" JavaScript 代码或调用函数" 例如： <INPUT type=”BUTTON” … onClick=“alert(“单击我！”);”> <INPUT type=”BUTTON” … onMouseDown=“check( )”> 表示鼠标按下时，将调用执行函数check( )
北大青 7E 男 Javascript事件 事件名 说明 on click 鼠标单击 on Change 文本内容或下拉菜单中的选项发生改变 onFocus 获得焦点,表示文本框等获得鼠标光标。 on Blur 失去焦点,表示文本框等失去鼠标光标。 on MouseOver 鼠标悬停,即鼠标停留在图片等的上方 on Mouseout 鼠标移出,即离开图片等所在的区域 onMouseMove 鼠标移动,表示在<D>层等上方移动 onload 网页文档加载事件 on Submit 表单提交事件 on Mouse Down 鼠标按下 onMouseUp 鼠标弹起 长e ACCP V4.0
ACCP V4.0 7 JavaScript 事件 事件名 说明 onClick 鼠标单击 onChange 文本内容或下拉菜单中的选项发生改变 onFocus 获得焦点，表示文本框等获得鼠标光标。 onBlur 失去焦点，表示文本框等失去鼠标光标。 onMouseOver 鼠标悬停，即鼠标停留在图片等的上方 onMouseOut 鼠标移出，即离开图片等所在的区域 onMouseMove 鼠标移动，表示在<DIV>层等上方移动 onLoad 网页文档加载事件 onSubmit 表单提交事件 onMouseDown 鼠标按下 onMouseUp 鼠标弹起
些x2 on Focus和 on blur事件-1 <HEAD> 文本框获得鼠标焦点时 <SCRIPT language= JavaScript ( onFocus)调用的函数 function myfun1() 清空卡号文本框 i( document myform card value=="请注意格式:10x0 document myform card value= 文本框失去鼠标焦点时 function myfun20) ( on Blur)调用的函数: 判断格式是否正确 var a=document. myform card value if (a substr(0, 2)!="10 isNaN(a)) alert(("格式错误,请重新输入") focus()方法 document myform card. focus 再次获得焦点,即鼠标 光标回到卡号文本框 </SCRIPT> </HEAD>
ACCP V4.0 8 card pass myform <HEAD> <SCRIPT language="JavaScript" > function myfun1( ) { if (document.myform.card.value=="请注意格式：10xxxxxx") document.myform.card.value="" ; } function myfun2( ) { var a=document.myform.card.value; if (a.substr(0,2)!="10" || isNaN(a)) { alert("格式错误，请重新输入") ; document.myform.card.focus(); } } </SCRIPT> </HEAD> onFocus和onBlur 事件-1 文本框获得鼠标焦点时 （onFocus）调用的函数： 清空卡号文本框 文本框失去鼠标焦点时 （onBlur）调用的函数： 判断格式是否正确 focus( )方法 再次获得焦点，即鼠标 光标回到卡号文本框
on Focus和 on blur事件-2 <STYLE type="text/CSs"> 表单元素<|NPUT>样式 input 添加事件处理 background-color:#55FFFF, font-size: 20px border: 1 px solid </STYLE> ACCP V4.0
ACCP V4.0 9 <BODY> <FORM name="myform"> <H2>卡号： <INPUT name = card type = text onFocus="myfun1( )“ value="请注意格式：10xxxxxx“ onBlur="myfun2( )" > <BR> 密码： <INPUT name = pass type = text > </H2> </FORM> </BODY> onFocus和onBlur 事件-2 <STYLE type="text/css"> <!-- input { background-color: #55FFFF; font-size: 20px; border: 1px solid; } --> </STYLE> 表单元素<INPUT>样式 添加事件处理