一.使用juquery的方法:
<!doctype html>
<html lang="en"><head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<title>Document</title>
<script type="text/javascript">
$(document).ready(function() {
$("#ut li").hover(function(){
$(this).addClass("ljf").siblings().removeClass("ljf");
});
});
</script>
<style type="text/css">
ul li{width:100px;border:1px solid red;}
.ljf{background:red}
</style>
</head>
<body>
<ul id="ut">
<li>liu</li>
<li>jian</li>
<li>fu</li>
</ul>
</body>
</html>
效果：
二 js原生态的写法
<div class="list-box">
<ul class="list-none" >
<li οnclick="clickRelationName(this)">收购</li>
<li οnclick="clickRelationName(this)">担保</li>
<li οnclick="clickRelationName(this)">增资</li>
<li οnclick="clickRelationName(this)">法人</li>
<li οnclick="clickRelationName(this)">董事长</li>
<li οnclick="clickRelationName(this)">股东</li>
</ul>
</div>
//类型选择的触发事件
function clickRelationName(obj){
$(obj).addClass("left-tab-active").siblings().removeClass("left-tab-active");//互斥显示颜色
}
效果:
124
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
