1.介绍
事件编程让用户不仅能够浏览页面中的内容，而且还可以和页面元素进行交互。
2.表单事件
onchange 当元素改变时执行脚本
onsubmit 当表单被提交时执行脚本
onreset  当表单被重置时执行脚本
onselect 当元素被选取时执行脚本
onblur  当元素失去焦点时执行脚本
onfocus  当元素获得焦点时执行脚本
在这里我重点说明一下用于form标签的onsubmit事件。
<form action="" method=post onsubmit="return show()">
注意这里的onsubmit事件必须有return。
show函数里面必须有return true或者return false语句。
function show(){//记住submit事件必须有return
var username=document.all.username.value;
var psw=document.all.psw.value;
var repsw=psw.value;
if(username==""){
document.all.Checkusername.value="用户名不能为空";
return false;
}else if(document.all.psw.value==""||psw.value==""){
alert("密码不能为空");
return false;
}else if(psw!=repsw){
alert("密码不一致");
return false;
}
else{
return true;
}
}
对于其他的form事件我用一个例子去解释：
<html>
<head>
<script language="javaScript">//readonly 的使用....这里总结的很多啊
function showTotal(){
var s=document.all.price.value; //那么相比有没有checked属性了？？
var s0=s.split("元");
var s1=s0[0];
var ss=document.all.amout.value;
var wo=s1*ss;
al.value=wo;
}
function clearAll(){//不能用clear
document.all.username.value="";
}
</script>
</head>
<body> 
<center>   
<table border=1 bgcolor="teal">
<tr>
<td rowspan=5><img src="img/mouse_over.jpg" alt="mouse"></td>
<td>账号：<input type="text" size=20 id="username" value="请输入您的淘宝账号" onfocus="clearAll()"></td>
</tr>
<tr>
<td>单价：<input type="text" size=20 id="price" value="79元" readonly ></td>
</tr>
<tr>
<td>数量：<input type="text" size=20 id="amout" value="1" onchange="showTotal()"></td>
</tr>
<tr>
<td>总价：<input type="text" size=20 id="total" value="79元" readonly ></td>
</tr>
<tr>
<td align="center"><input type="button" size=20 id="buy" value="购买" ></td>
</tr>
</table>
</center>
</body>
</html>
3.鼠标事件
onclick  当鼠标被单击时执行脚本
ondblclick 当鼠标被双击时执行脚本
onmousedown 当鼠标按钮被按下时执行脚本
onmousemove 当鼠标指针移动时执行脚本
onmouseout 当鼠标指针移出某元素时执行脚本
onmouseover 当鼠标指针悬停于某元素之上时执行脚本
onmouseup 当鼠标按钮被松开时执行脚本
同样是一个例子：
<html>
<head>
<script language="javaScript">
function welcome(){
document.all.gup.src="img/mouse_out.jpg";
}
function bye(){
document.all.gup.src="img/mouse_over.jpg";
}
</script>
</head>
<b
ody>     
<img src="img/mouse_over.jpg" name="gup" onmouseover="welcome()" onmouseout="bye()"></img>
</body>
</html>
js脚本编程入门
4. 键盘事件
onkeydown  当键盘被按下时执行脚本
onkeypress  当键盘被按下后又松开时执行脚本
onkeyup  当键盘被松开时执行脚本
下面是一个例子：
<html>
<head>
<script language="javaScript">
function welcome(event){
var keycode=event.keyCode;
alert(keycode);
}
</script>
</head>
<body onkeyup="welcome(event)">  //注意这里需要event 
</body>
</html>
注意：方法中必须传event
keyCode是属性。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。