jQuery klik untuk menukar kelas dan togol dan toggleClass() kaedah takrifan usage

jQuery klik untuk menukar kelas dan togol dan toggleClass() kaedah takrifan usage_jquery

WBOY

Lepaskan： 2016-05-16 15:26:25

asal

1523 orang telah melayarinya

Saya menggunakan gaya lama, jadi tanpa berlengah lagi, saya akan menghantar kod tersebut.

<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">
//参数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" class="bg1" onClick="toggle1('p1')" style="height:31px">点击此处显示或隐藏上面部分并更换自己的样式(包括背景图、字体等）</p>
</body>
</html>

Salin selepas log masuk

kaedah jQuery toggleClass()

Contoh

Togol kelas "utama" yang menambah dan mengalih keluar semua elemen

$("button").click(function(){
$("p").toggleClass("main");
});

Salin selepas log masuk

Takrif dan penggunaan

Kaedah toggleClass() bertukar antara menambah dan mengalih keluar satu atau lebih kelas elemen yang dipilih.

Kaedah ini menyemak kelas yang ditentukan dalam setiap elemen. Menambah kelas jika ia tidak wujud, atau mengalih keluarnya jika ia ditetapkan. Ini dipanggil kesan togol.

Walau bagaimanapun, dengan menggunakan parameter "suis", anda boleh menentukan bahawa hanya kelas akan dialih keluar atau hanya ditambah.

Tatabahasa

$(selector).toggleClass(classname,function(index,currentclass),switch)

Salin selepas log masuk