js选项卡 php,JS怎么做出选项卡

这次给大家带来的是JS怎么做出选项卡，选项卡是我们在项目中经常使用到的功能，如何实现呢？这篇文章就给大家好好分析一下。

jquery选项卡

#div1 div{width: 200px;height: 200px;border: 1px red solid;display: none;}

.active{background:#999;}

window.οnlοad=function(){

var oDiv=document.getElementById('div1');

var aInput=document.getElementsByTagName('input');

var aCon=oDiv.getElementsByTagName('div');

for (var i = 0; i < aInput.length; i++) {

aInput[i].index=i;

aInput[i].οnclick=function(){

for (var i = 0; i < aInput.length; i++) {

aInput[i].className='';

aCon[i].style.display='';

}

this.className='active';

aCon[this.index].style.display='block';

}

}

}

$(function(){

$('#div1').find('input').click(function(){

$('#div1').find('input').attr('class','');

$('#div1').find('div').css('display','none');

$(this).attr('class','active');

$('#div1').find('div').eq($(this).index()).css('display','block');

})

})

11111

22222

33333

相信看了以上介绍你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

相关阅读：