基于vue的ui框架_基于javascript tab切换选项卡原生写法

更新时间:2017-03-10    来源:php框架模板    手机版     字体:

【www.bbyears.com--php框架模板】

下面方法很简单,就是利用ta,tb的值来获取指定div的id的style是dispay=block或none来显示或隐藏div哦,实现切换效果。

// JavaScript Document
function show1(ta,tb,tt)
{
  for (i=1;i<=tb;i++)
  {
    if (tt==i)
    {
      document.getElementById(ta+"1"+tt).style.display="block";
      document.getElementById(ta+"0"+tt).className="iover";
    }
    else
    {
      document.getElementById(ta+"1"+i).style.display="none";
      document.getElementById(ta+"0"+i).className="iout";
    }
  }
}

function show2(ta,tb,tt)
{
  for (i=1;i<=tb;i++)
  {
    if (tt==i)
    {
      document.getElementById(ta+"1"+tt).style.display="block";
      document.getElementById(ta+"0"+tt).className="iover";
    }
    else
    {
      document.getElementById(ta+"1"+i).style.display="none";
      document.getElementById(ta+"0"+i).className="iout";
    }
  }
}
function show3(ta,tb,tt)
{
  for (i=1;i<=tb;i++)
  {
    if (tt==i)
    {
      document.getElementById(ta+"1"+tt).style.display="block";
      document.getElementById(ta+"0"+tt).className="iover";
    }
    else
    {
      document.getElementById(ta+"1"+i).style.display="none";
      document.getElementById(ta+"0"+i).className="iout";
    }
  }
}

//内容切换
function listme(alln,n,OverID,OutID,OverClass,OutClass){
for(var i=1;i if(i==n){
document.getElementById(OverID+i).className=OverClass;
document.getElementById(OutID+i).style.display="";
}else
{
document.getElementById(OverID+i).className=OutClass;
document.getElementById(OutID+i).style.display="none";
}
}
}

本文来源:http://www.bbyears.com/jiaocheng/31069.html

猜你感兴趣