选项卡事件测试
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>选项卡事件测试</title>
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("a").click(function() {
//下标
var num = $(this).index();
//jQuery 遍历 - siblings() 方法
$(this).parent().siblings().children().eq(num).show().siblings().hide();
console.log($(this).parent().siblings().children().eq(num).show().siblings().hide());
//
});
});
</script>
</head>
<body>
<div>
<a id="1" value="1" href="javascript:">按钮一</a>
<a id="2" value="2" href="javascript:">按钮二</a>
<a id="3" value="3" href="javascript:">按钮三</a>
</div>
<br/>
<div>
<div id="div1" class="div" style=" 600px;height: 400px;display: block;background-color: #CC5522;"></div>
<div id="div2" class="div" style=" 600px;height: 600px;display: none;background-color: #FF0000;left: 100px;top: -400px;"></div>
<div id="div3" class="div" style=" 600px;height: 500px;display: none;background-color: #6495ED;left: 100px;top: -400px;"></div>
</div>
</body>
</html>