首頁 > 網際網路

JS中如何刪除選中核取方塊的行

2019-12-11 17:25:16

在做網頁開發時,我們經常會使用到JS來做頁面互動,比如點選按鈕,觸發彈出視窗,點選刪除選中的核取方塊項等等,下面我們就來看下在JS中,是如何刪除選中核取方塊的行的。

1

為了方便對頁面元素的操作,我們這裡使用JQuery來操作頁面元素,所以先在頁面引入對應指令碼檔案。


2

在html裡,我們新增多個div,每個div為一行,裡面有一個核取方塊。

後面再加上一個按鈕,用來觸發刪除操作。


3

js指令碼裡,我們先用jquery程式碼獲取到選中的複選項,這裡.cb這個是核取方塊的樣式名,後面:checked表示選擇的核取方塊必須是選中狀態的。


4

然後再迴圈這個選中的項,用jquery獲取這個複選項的父節點,通過div的樣式名:item去取得父div,因為我們要刪除的是這個div,而不是只刪除核取方塊。

得到對應的div後,呼叫remove方法就行了。


5

執行頁面,如果我們不選擇任何一個核取方塊,直接點選刪除按鈕,是不會刪除任意一項的。


6

我們這裡選擇上選項2和選項4,這二項,然後點選刪除按鈕。


7

點選後,可以看到這二項被刪除掉了。程式碼邏輯正常,沒問題。



IT145.com E-mail:sddin#qq.com