菜单 学习猿地 - LMONKEY

VIP

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练!告别无效练习

接私单赚外块

VIP优先接,累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

入驻
446
0

tab切换

原创
05/13 14:22
阅读数 93064
(function(){
  var tit = $("#tab a"),
      con = $("#tcontent>div"),
      cur = 'cur';
      tit.mousemove(function(){
          var index = tit.index(this);
          $(this).addClass('cur').siblings().removeClass('cur');
          con.eq(index).show().siblings().hide();
      });
})();

 

 

原生js的tab切换

var test = document.getElementById("testbtn"),
		li = test.getElementsByTagName("span"),
		testul = document.getElementById("test"),
		lis = testul.getElementsByTagName("li"),

		exeFun = function(num){
			for (var i = 0,len = li.length;i<len;i++) {
				
				if(num == i){

					li[i].className = "cur";

					lis[i].style.display = "block"

				}else{

					li[i].className = "";

					lis[i].style.display = "none"

				}
			};

		};

	for(var i=0,len = li.length;i<len;i++){

		li[i].onclick = function(num){

				

				return function(){

					console.log(num);

					exeFun(num);

				}


		}(i);


	}

 

 

function clicktabs(tit_id,box_id,cur){
    var g_tags=$(tit_id),
        g_conts=$(box_id),
        g_current=cur;
    g_tags.live('mouseover',function(){
        var g_index=g_tags.index(this);
        $(this).addClass(g_current).siblings().removeClass(g_current);
        g_conts.eq(g_index).show().siblings().hide();
    })
}
clicktabs("#tab>strong","#reg>div","cur");

  

$('.tab').click(function(){



	var index = $('.tab').index(this),  //第一次点击的li的收银纸

		ele = $(this).find('.ind');



	$('.tab').each(function(i){

			if(i != index){
					$(this).find('.ind').hide(); 
			}




	});

	if(ele.is(':hidden')){
		ele.show();
	}else{
		ele.hide();
	}

});

  

发表评论

0/200
446 点赞
0 评论
收藏