Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Bagaimana untuk menentukan sama ada kotak semak semuanya dipilih dalam jquery

Bagaimana untuk menentukan sama ada kotak semak semuanya dipilih dalam jquery

青灯夜游
Lepaskan: 2022-09-07 18:39:31
asal
2660 orang telah melayarinya

Langkah penghakiman: 1. Dapatkan semua elemen kotak semak dengan sintaks "$("input[type='checkbox']")", yang akan mengembalikan objek jQuery 2. Pilih semua elemen yang dipilih dengan sintaks "$ (":checked")" akan mengembalikan objek JQ; 3. Kira panjang dua objek dan tentukan sama ada kedua-dua panjang adalah sama. . Jika mereka sama, maka Pilih semua, jika tidak semua tidak dipilih.

Bagaimana untuk menentukan sama ada kotak semak semuanya dipilih dalam jquery

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 3.6.1, komputer Dell G3.

Cara jquery menentukan sama ada kotak pilihan semuanya dipilih: Semak sama ada bilangan elemen berbilang pilihan dalam kotak semak adalah sama dengan bilangan elemen yang dipilih.

Langkah pelaksanaan:

Langkah 1: Gunakan pemilih nilai atribut untuk mendapatkan elemen kotak semak

$("input[type='checkbox']")
Salin selepas log masuk

Akan mengembalikan objek jQuery yang mengandungi semua elemen kotak semak.

Langkah 2: Gunakan pemilih :checked untuk memilih semua elemen yang dipilih

$(":checked")
Salin selepas log masuk

akan mengembalikan objek jQuery yang mengandungi semua elemen yang dipilih.

Langkah 3: Gunakan atribut panjang untuk mengira panjang dua objek jQuery dan tentukan sama ada kedua-dua panjang adalah sama

checkbox元素对象.length==选中元素对象.length
Salin selepas log masuk
  • Jika ia adalah sama (Nilai pulangan adalah benar), maka kotak semak semua dipilih

  • Jika ia tidak sama (nilai pulangan adalah palsu), maka kotak semak bukan semua dipilih

Contoh pelaksanaan: Tentukan sama ada kotak pilihan semua dipilih



	
		
		
		
	
	
		
您喜欢的水果?



Salin selepas log masuk

Bagaimana untuk menentukan sama ada kotak semak semuanya dipilih dalam jquery

Pengetahuan lanjutan: Pemilih nilai atribut

<strong>$("[attribute|=&#39;value&#39;]")</strong>$("[attribute|='value']")

Pilih nilai atribut yang ditentukan bersamaan dengan rentetan yang diberikan atau tukar Elemen yang rentetannya diawali (rentetan diikuti dengan tanda sempang "-").

atribut: nama atribut

nilai: nilai atribut
$(function(){

    $(&#39;a[hreflang|="en"]&#39;).css("border","2px solid red");
        //查找hreflang属性值是英语的所有链接。
});
Salin selepas log masuk

<strong>$("[attribute*=&#39;value&#39;]")</strong>

$("[attribute*='value']")



Memilih elemen dengan atribut tertentu yang mengandungi subrentetan tertentu. (Atribut yang diberikan dipilih untuk mengandungi elemen dengan nilai tertentu)

atribut: nama atribut
$(function(){
    $(&#39;input[name*="man"]&#39;).css("border","2px solid red");
        //查找所有 input 的 name 属性中带有 &#39;man&#39; 的元素,并添加边框
});
Salin selepas log masuk
nilai: nilai atribut, yang boleh menjadi perkataan tanpa petikan atau rentetan petikan.

<strong>$("[attribute~=&#39;value&#39;]")</strong>

$("[attribute~='value']")

Pilih nilai yang dipisahkan ruang bagi atribut yang ditentukan mengandungi elemen tertentu.
$(function(){

    $(&#39;input[name~="man"]&#39;).css("border","2px solid red");
        //查找所有属性中含有 &#39;man&#39; 这个单词的文本框,并且修改其文本值。
})
Salin selepas log masuk
atribut: nama atribut

nilai: nilai atribut, yang boleh menjadi perkataan tanpa petikan atau rentetan petikan. $("[attribute$=&#39;value&#39;]")



Memilih elemen yang atributnya ditentukan berakhir dengan elemen yang diberikan. Perbandingan elemen ini adalah sensitif huruf besar.
$(function(){
    $(&#39;input[name$="letter"]&#39;).css("border","2px solid red");
            //查找所有的属性名称以"letter"的结束,并把他们的文字输入。
})
Salin selepas log masuk
atribut: nama atribut

nilai: nilai atribut, yang boleh menjadi perkataan tanpa petikan atau rentetan petikan. $("[attribute=&#39;value&#39;]")


Memilih elemen yang atributnya ditentukan ialah nilai yang diberikan.
$(function(){
    $(&#39;input[value="Hot Fuzz"]&#39;).next().text("Hot Fuzz");
        //查找input 中 value 值等于 Hot Fuzz 的将其后面的元素添加文本。
})
Salin selepas log masuk
atribut: nama atribut. Nilai

: nilai atribut, yang boleh menjadi perkataan tanpa petikan atau rentetan petikan. $("[attribute!=&#39;value&#39;]")


Pilih elemen yang atribut yang ditentukan tidak sama dengan nilai ini
$(function(){
    $(&#39;input[name!="newsletter"]&#39;).next().append("<b>;not newsletter</b>")
            //查找input 中name 不等于 newletter 的下一个元素追加 文本。
                注:主要含有这个字符串就行。
})
Salin selepas log masuk
atribut: nama atribut

nilai: nilai atribut, yang boleh menjadi satu Perkataan tanpa petikan, atau rentetan petikan. $("[attribute^=&#39;value&#39;]")


Pilih elemen yang bermula dengan rentetan yang diberikan dengan atribut yang ditentukan.
$(function(){
    $(&#39;input[name^="news"]&#39;).val("news here!");
    //查找input 中 name 中含有new 这个字符串的 添加value 值。
})
Salin selepas log masuk
atribut: nama atribut

nilai: nilai atribut, yang boleh menjadi perkataan tanpa petikan atau rentetan petikan. $("[attribute]")

$(function(){
    $(&#39;div[id]&#39;).css("color","red")
            //给绑定id属性的div的文本颜色变成红色。
})
Salin selepas log masuk
Memilih semua elemen dengan atribut yang ditentukan, yang boleh berupa sebarang nilai.

atribut: nama atribut. $("[attributeFilter1][attributeFilter2]attributeFilter3")




Memilih elemen yang sepadan dengan semua penapis atribut yang ditentukan

attributeFilter1: satu penapis atribut
$(function(){
    $(&#39;input[id][name$="man"]&#39;).val(&#39;only this one&#39;)
    //查找那些有id属性,并且name 属性以man结尾的输入框,并设置值。
})
Salin selepas log masuk
attributeFilter2: penapis Atribut lain digunakan untuk mengurangkan lagi elemen yang dipilih.

attributeFilterN: Terdapat lebih banyak penapis atribut mengikut keperluan. [Pembelajaran yang disyorkan: tutorial video jQuery

, video bahagian hadapan web]

Atas ialah kandungan terperinci Bagaimana untuk menentukan sama ada kotak semak semuanya dipilih dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

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