简单选项卡(js)

JS 代码

window.onload = function(){
		var oDiv = document.getElementById('div1');
		var aBtn = oDiv.getElementsByTagName('input');
		var aDiv = oDiv.getElementsByTagName('div');
		
		for(var i=0; i<aBtn.length; i++)
		{	
			aBtn[i].index=i;
			aBtn[i].onclick = function()
			{
				for(var i=0; i<aBtn.length; i++)
				{
					aBtn[i].className='';
					aDiv[i].style.display='none';
				}
				this.className='active';
				aDiv[this.index].style.display='block';
			}
		}
		
	}

  html代码

<div id="div1">
	<input type="button" class="active" value="教育">
    <input type="button" value="培训">
    <input type="button" value="招生">
    <input type="button" value="出国">
    <div style="display:block">11111</div>
    <div>22222</div>
    <div>33333</div>
    <div>44444</div>
</div>

  在网上看智能社blue老师视频跟着写的代码~ 学到了很多~ 感谢blue老师~ 转载注明出处~呵呵

posted @ 2014-04-20 21:16  oceanden  阅读(355)  评论(0编辑  收藏  举报