标签：
昨天看了点视频，今天敲了敲，代码还是可以再优化的，先贴出来，怎么着也是第一次。。。废话不多说，写的很简单，不喜勿喷！
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
input {width: 100px; height: 30px;}
.active {background: red;}
.con {display: none; width: 420px; height: 300px; border:red 1px solid;}
</style>
<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
<title>jQuery版tab切换</title>
</head>
<body>
<div>
<input class="active" value="1" type="button" />
<input value="2" type="button"/>
<input value="3" type="button"/>
<input value="4" type="button"/>
<div class="con" style="display: block;">1111</div>
<div class="con" >2222</div>
<div class="con">3333</div>
<div class="con">4444</div>
</div>
<script type="text/javascript">
$(function(){
$(‘input‘).click(function(){
$(‘input‘).removeClass(‘active‘);
$(this).addClass(‘active‘);
var i = $(this).index();
$(‘.con‘).css(‘display‘,‘‘);
$(‘.con‘).eq(i).css(‘display‘,‘block‘);
});
})
</script>
</body>
</html>
标签：
原文地址：http://www.cnblogs.com/liaoranty/p/4402025.html
