<!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>jQuery 点击变色</title>
</head>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
<style>
.mt10{margin-top:5px;}
.hand{cursor:pointer;}
.menu_city ul li{float:left; background:#CCC;padding:6px 20px; margin-right:1px;list-style:none;}
.clearfix a li:hover{background-color: #FF00FF;}
</style>
<script>
function getMoney(moudle){
var id= $(moudle).attr("id");
var a = document.getElementsByName("a");
for(var i=0;i<a.length;i++){
var item = a[i];
if($(item).attr("id")==id){
$(item).find("li").css("background-color","blue");
continue;
}
$(item).find("li").css("background-color","#CCC");
}
}
</script>
<body class="index">
<div class="menu_city" >
<ul class="clearfix">
<a href="javascript:void(0)" style="color:#FFFFFF;" id="a1" name="a" οnclick="getMoney(this)"><li id="1">100</li></a>
<a href="javascript:void(0)" style="color:#FFFFFF;" id="a2" name="a" οnclick="getMoney(this)"><li id="2">300</li></a>
<a href="javascript:void(0)" style="color:#FFFFFF;" id="a3" name="a" οnclick="getMoney(this)"><li id="3">500</li></a>
<a href="javascript:void(0)" style="color:#FFFFFF;" id="a4" name="a" οnclick="getMoney(this)"><li id="4">1000</li></a>
</ul>
</div>
</body>
</html>
转载请注明原文地址: https://ju.6miu.com/read-680062.html
