jquery點擊改變class并toggle的實現(xiàn)代碼

字號:


    下面小編就為大家?guī)硪黄猨query點擊改變class并toggle的實現(xiàn)代碼。小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。
    jquery點擊改變class并toggle的實現(xiàn)代碼
    <html>
    <head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript" src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"></script>
    <style>
    .bg1 {
      background-image:url(images/21.jpg);
      background-repeat:no-repeat;
      color:#0CF;
    }
    .bg2 {
      background-image:url(images/22.jpg);
      background-repeat:no-repeat;
      color:#F00;
    }
    </style>
    <script type="text/javascript">
    //參數(shù)para1:希望隱藏元素的id值
    function toggle1(para1){
      if ($("#p2").attr("class")=="bg1")
      {
        $("#p2").attr("class","bg2");
      }
      else 
      {
        $("#p2").attr("class","bg1");
      }
      $("#"+para1).toggle();
    }
    </script>
    </head>
    <body>
    <p id="p1">此處將顯示或隱藏</p>
    <p id="p2" onClick="toggle1('p1')">點擊此處顯示或隱藏上面部分并更換自己的樣式(包括背景圖、字體等)</p>
    </body>
    </html>
    以上這篇jquery點擊改變class并toggle的實現(xiàn)代碼就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考