鼠标移动事件
鼠标点击事件(click/dblclick/mousedown/mouseup)
加载与卸载事件(load/unload)
聚焦与离焦事件
|
键盘事件
提交与重置事件
选择与改变事件 //比如选地址,选完省份后面跟着跳出对应的市区
|
<script type="text/javascript">
//回调函数 我们没有显示的调用它。
function movefunc(event){
//window.status = "hello"; //浏览器左下角状态栏显示信息
window.status = event.clientX+","+event.clientY;
//alert("hello");
}
function clear(event){ //与上面相对,括号里可以不传参数
window.status = "清空了";
}
function over(){ //鼠标遇到div边界触发
//alert("I am in");
}
</script>
<center>
<div style="border:solid 2px; 5cm; height:5cm" onmousemove = "movefunc(event)" onmouseout="clear(event)" onmouseover="over()">
</div>
|
<script type="text/javascript">
function function1(){
alert("你刚刚双击了!");
}
function function2(){
alert("你刚刚单击了!");
}
</script>
<input type="button" value="双击我" ondblclick="function1()">
<input type="button" value="单击我" onclick="function2()">
|
<script type="text/javascript">
function changePosition(){
var adv = window.document.getElementById("adv");
adv.style.top=Math.random()*60+"px";
adv.style.left=Math.random()*100+"px";
setTimeout("changePosition()",1000);
}
function showmsg(){
alert("要关闭了");
}
</script>
<body onload="changePosition()" onunload="showmsg()">
<div id="adv" style="position:absolute; top:0.5cm; left:1cm">
<a href="http://www.baidu.com" target="_blank"><img src="cartoon.gif" /></a>
</div>
|
<script type="text/javascript">
function cleardefault(){
document.getElementById("name").value="";
}
function validate(){
var psd= document.getElementById("psd").value ;
if(psd=="")
alert("密码不能为空")
}
</script>
<pre>
用户名 <input id="name" type="text" value="请在此输入姓名" onfocus="cleardefault()" onblur="alert('用户名不能为空')" ><br>
密 码 <input id="psd" type="password" value="" onblur="validate()">
</pre>
|
<script type="text/javascript">
function handle(event){
if(event.keyCode==13) //keycode 是对应键值的ascII码,确认是13
alert("你点击了确认键,请问是否要提交?")
}
</script>
<form method="post" action="">
<input type="text" value="123" onkeypress="handle(event)" />
</form>
|
<script type="text/javascript">
function confirm_xxx(){ //当用户点击表单里的提交按钮时,自动被调用
var confrimvalue= window.confirm("是不是要提交");
if( confrimvalue )
return true;
else
return false;
}
function showmsg(){
alert("数据已经复位!")
}
</script>
<form method="post" action="02inner.html" onsubmit="return confirm_xxx(this) onreset="showmsg()" >
<input type="submit" value="提交" onclick="alert('hello')"/>
//onclick不要也可以,点击提交会执行function
<input type="reset" value="重置" />
</form>
|
<script type="text/javascript">
function changCity(){
//先获取第一个select的值
var select1= document.getElementById("province")
citylist1=['济南','青岛','威海'];
citylist2=['长沙','岳阳','湘潭'];
var select2= document.getElementById("city")
if(select1.selectedIndex==1){
for(var i=0;i<citylist1.length;i++)
select2.innerHTML += "<option value=" +citylist1[i]+ ">"+citylist1[i]+"</option>"
}else{
for(var i=0;i<citylist2.length;i++)
select2.innerHTML += "<option value=" +citylist2[i]+ ">"+citylist2[i]+"</option>"
}
}
</script>
|
籍贯:
<select id="province" onchange="changCity()">
<option value="0">请选择省份</option>
<option value="1">山东</option>
<option value="2">湖南</option>
</select>
<select id="city"></select>
|