jquery實現核取方塊全選,全不選,反選中的問題

2021-10-23 11:35:30 字數 2300 閱讀 3131

今天試了一下用jquery選擇核取方塊,本來以為很簡單的東西卻有bug,於是搜尋了一下找到了解決方法。

html**如下(這裡沒有用任何樣式,就沒有再放css了):

<

html

>

<

head

>

<

meta

charset

="utf-8"

>

<

link

rel="stylesheet"

href

="test_ch5.css"

>

<

title

>test_ch5

title

>

head

>

<

body

>

<

div

id>

<

form

action

=""method

="post"

>

<

p>你最愛好的運動是?

p>

<

input

type

="checkbox"

name

="items"

>

足球

<

input

type

="checkbox"

name

="items"

>

籃球

<

input

type

="checkbox"

name

="items"

>

羽毛球

<

input

type

="checkbox"

name

="items"

>桌球<

br>

<

input

type

="button"

id="all"

value

="全 選"

>

<

input

type

="button"

id="no"

value

="全不選"

>

<

input

type

="button"

id="reverse"

value

="反 選"

>

<

input

type

="button"

id="send"

value

="提 交"

>

form

>

div>

body

>

<

script

src="jquery-3.2.1.js"

>

script

>

<

script

>

$(function

());

$("#no

").click(

function

() );

$("#reverse

").click(

function

() );

});})script

>

html

>

介面如下:

之前不知道有prop,使用prop的地方全部用的是attr,發現實現不了想要的功能啊,然後才發現的prop,它是是jquery1.6以後出來的,用來區別之前的.attr()方法.

區別最大的一點就是:布林型的屬性,1.6以後都是用.prop()方法就好了。

這個布林型的屬性,再解釋一下,是屬性值只有true|false的屬性。

還有種情況就是只新增屬性名,不需要寫屬性值的就可以生效的也同樣使用.prop()方法。比如:checked、disable這樣的,其實它們說到底還是屬於布林型的屬性。

1.新增屬性名稱該屬性就會生效應該使用prop();

2.是有true,false兩個屬性使用prop();

3.其他則使用attr();

js 實現 核取方塊全選與全不選

js按鍵事件說明 onclick事件 滑鼠單擊事件是最常見的事件之一,當使用者單擊滑鼠按鈕時。同時onclick指定的事件處理程式或 將被呼叫執行。檔案說明 第11行使用 onclick事件彈出警告提示對話方塊。onchange事件 onchange事件就是當文字框的內容改變時發生的事件。檔案說明 ...

js實現核取方塊全選 全不選特效

js實現核取方塊全選 全不選特效 html js param idorname 如果傳入id 前面加上 如果傳入name 直接傳入 returns 返回元素節點 如果沒找到 返回null function idorname else return obj param parentnode 父節點 r...

jQuery 核取方塊 全選無效

問題 今天乙個同事在做乙個使用者全選的小功能的時候碰到乙個小問題,就是明明用jquery的attr 把核取方塊設定成checked了,用debuger 也可以看到屬性已經設定上去,但頁面顯示還是沒有選中 解決辦法 原來是jquery中attr 和 prop 的區別造成的。其中attr 是用來操作元素...