Rumah > hujung hadapan web > tutorial js > Jquery pilih semua dan pilihan terbalik contoh code_jquery

Jquery pilih semua dan pilihan terbalik contoh code_jquery

WBOY
Lepaskan: 2016-05-16 15:31:14
asal
1173 orang telah melayarinya

Artikel ini akan berkongsi dengan anda sekeping kod berdasarkan fungsi pilih semua, pemilihan songsang dan nyahpilih jQuery, yang sesuai untuk senario di mana operasi kelompok (seperti pemadaman kelompok, dll.) diperlukan selepas berbilang pilihan pada web muka surat. Artikel itu menggabungkan contoh, kodnya ringkas, dan pada asasnya merangkumi semua aspek operasi pemilihan pilihan Saya harap ia dapat membantu peminat WEB yang memerlukan.

//Pilih semua, pilih tiada

 $('#checkAll').click(function () {
  //判断是否被选中
  var bischecked = $('#checkAll').is(':checked');
  var fruit = $('input[name="check"]');
  bischecked ? fruit.attr('checked', true) : fruit.attr('checked', false);
 });
Salin selepas log masuk

//Pemilihan songsang Lintas kotak semak Jika ia sedang dipilih, tetapkannya kepada tidak dipilih, ia adalah sama

 $("#tabVouchList tr").each(function () {
  if ($("td:eq(0) input[name='check']", $(this)).is(':checked')) {
   $(this).attr('checked', false);
  } else {
   $(this).attr('checked', true);
  }
 });
Salin selepas log masuk

Jadual HTML

<table id="tabVouchList">
 <tr>
  <th>
   <input type="checkbox" name="checkAll" />
  </th>
  <th>
   行号
  </th>
  <th>
   名称
  </th>
 </tr>
 <tr>
  <td>
   <input type="checkbox" name="check" />
  </td>
  <td>
   行号
  </td>
  <td>
   名称
  </td>
 </tr>
</table>
Salin selepas log masuk

Kod di atas adalah semua kod untuk jquery untuk merealisasikan pemilihan semua dan pilihan songsang bukankah kod itu sangat mudah?

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan