标签：javascript 联动菜单 定时器
一个简单的联动菜单：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html"; charset="utf-8" />
<title>联动菜单</title>
</head>
<script type="text/javascript">
var area = [
['朝阳','海淀','门头沟'],
['淮南','淮北','合肥']
];
function ld(){
var sel = document.getElementById('prov');
var opt = '';
if(sel.value == -1){
document.getElementById('city').innerHTML = opt;
return;
}
for(var i = 0 ; i < area[sel.value].length ; i++){
opt = opt + '<option value="' + i + '">'+area[sel.value][i] + '</option>';
//alert(opt);
}
document.getElementById('city').innerHTML = opt;
}
</script>
<body>
<select name="" id="prov" onchange="ld();">
<option value="-1">请选择</option>
<option value="0">北京</option>
<option value="1">安徽</option>
</select>
<select name="" id="city">
</select>
</body>
</html>演示样子：
定时器：
设置定时器：
window.setTimeout(‘语句‘,毫秒); //指定毫秒后执行一次语句。
注：定时器不属于js的知识，它是window对象提供的功能
window.setInterval(‘语句‘,毫秒); //每经过N毫秒执行语句。
清除定时器：
window.clearTimeout(‘定时器名‘);
window.clearInterval(‘定时器名‘);
例子：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html"; charset="utf-8" />
<title></title>
</head>
<style type="text/css">
img{
width: 300px;
height: 400px;
}
</style>
<script type="text/javascript">
function beng(){
var inp = document.getElementsByName('time')[0];
var time = parseInt(inp.value)-1;
inp.value = time;
if(time == 0){
document.getElementsByTagName('img')[0].src = 'image/next.jpg';
window.clearInterval(clock);
}
}
var clock = window.setInterval('beng()',1000);
</script>
<body>
<h1>定时器</h1>
<input type="button" name="time" value="5" /><br/>
<img src="image/before.jpg" alt="" />
</body>
</html>
版权声明：本文为博主原创文章，未经博主允许不得转载。
标签：javascript 联动菜单 定时器
原文地址：http://blog.csdn.net/bluedream1219/article/details/47154719
