亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

jQuery實(shí)例—選項(xiàng)卡的簡(jiǎn)單實(shí)現(xiàn)(js源碼和jQuery)

 更新時(shí)間：2016年06月14日 10:54:37   投稿：jingxian  
下面小編就為大家?guī)?lái)一篇jQuery實(shí)例—選項(xiàng)卡的簡(jiǎn)單實(shí)現(xiàn)(js源碼和jQuery) 。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧

分別利用javascript的源碼和jQuery來(lái)實(shí)現(xiàn)一個(gè)簡(jiǎn)單的選項(xiàng)卡，對(duì)比各自的步驟。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery實(shí)例—選項(xiàng)卡的簡(jiǎn)單實(shí)現(xiàn)(js源碼和jQuery) </title>
<style>
div{
  display:none;
  width:50px;
  height:50px;
  border:1px solid red;
  }
.active{
  display:block;
  }
.back{
  background:red;
  }
</style>
<script type="text/javascript" src="jquery-1.12.3.min.js"></script>
<script>
//javascript源碼寫(xiě)
/*window.onload=function(){
  var aInput=document.getElementsByTagName('input');
  var aDiv=document.getElementsByTagName('div');
  
  for(var i=0;i<aInput.length;i++){
    aInput[i].index=i;
    aInput[i].onclick=function(){
      for(var i=0;i<aInput.length;i++){
        aInput[i].className='';
        aDiv[i].style.display='none';
        }
      this.className='back';
      aDiv[this.index].style.display='block';
      }
    }
  };*/
  
//jQuery寫(xiě)  
$(function(){
  $('input').click(function(){
    $('input').attr('class','');
    $('div').css('display','none');
    $(this).attr('class','back');
    $('div').eq($(this).index()).css('display','block');
    
    });
  });
  
</script>
<script>

</script>
</head>

<body>
<input type="button" value="1" />
<input type="button" value="2" />
<input type="button" value="3" />
<div class="active">111</div>
<div>222</div>
<div>333</div>


</body>
</html>

以上這篇jQuery實(shí)例—選項(xiàng)卡的簡(jiǎn)單實(shí)現(xiàn)(js源碼和jQuery) 就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論