快捷導(dǎo)航

jQuery實現(xiàn)獲取多選框的值示例

更新時間：2020年02月07日 12:14:45 作者：weixin_37914752

這篇文章主要介紹了jQuery實現(xiàn)獲取多選框的值,結(jié)合實例形式分析了jQuery事件響應(yīng)及頁面元素屬性獲取相關(guān)操作技巧,需要的朋友可以參考下

本文實例講述了jQuery實現(xiàn)獲取多選框的值。分享給大家供大家參考，具體如下：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>www.dbjr.com.cn jQuery獲取多選框的值</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  </head>
  <body>蘋果:
    <input type="checkbox" name="id" value="aa">香蕉:
    <input type="checkbox" name="id" value="bb">橘子:
    <input type="checkbox" name="id" value="cc">
    <button id="btn">批量刪除</button>
  </body>
  <script>
  $('#btn').click(function () {
    var id=[];
    $("input[name='id']:checked").each(function(){
      id.push($(this).val());
    });
    console.log(id);
  });
  </script>
</html>

運行效果

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery頁面元素操作技巧匯總》、《jQuery常見事件用法與技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery擴展技巧總結(jié)》及《jquery選擇器用法總結(jié)》

希望本文所述對大家jQuery程序設(shè)計有所幫助。

您可能感興趣的文章:

相關(guān)文章

jQuery實現(xiàn)鼠標滑過Div層背景變顏色的方法
這篇文章主要介紹了jQuery實現(xiàn)鼠標滑過Div層背景變顏色的方法,涉及jQuery中hover及addClass方法的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-02-02
詳解JQuery基礎(chǔ)動畫操作
這篇文章主要介紹了JQuery基礎(chǔ)動畫操作，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-04-04
JQuery 獲取多個select標簽option的text內(nèi)容(實例)
下面小編就為大家?guī)硪黄狫Query 獲取多個select標簽option的text內(nèi)容(實例)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-09-09
淺談被jQuery拋棄的函數(shù)及替代函數(shù)
這篇文章主要介紹了被jQuery拋棄的幾個函數(shù)及其替代函數(shù)，我們在做項目開發(fā)的時候一定要注意，分享給大家參考下。
2015-05-05
jQuery 幻燈片插件(帶縮略圖功能)
非常不錯的一款帶縮略圖功能的基于jquery的幻燈片插件，需要的朋友可以參考下。
2011-01-01
通過上下左右鍵和回車鍵切換光標實現(xiàn)代碼
客戶有這樣一個需求在列表中的文本框里輸入數(shù)據(jù)時，要能夠通過上下左右鍵來切換光標，按回車鍵就把光標移到下一個文本框，接下來將為你介紹下如何實現(xiàn)，感興趣的朋友可以參考下
2013-03-03
jquery 合并內(nèi)容相同的單元格(示例代碼)
這篇文章主要是對jquery合并內(nèi)容相同的單元格示例代碼進行了介紹。需要的朋友可以過來參考下，希望對大家有所幫助
2013-12-12
jQuery實現(xiàn)購物車
這篇文章主要為大家詳細介紹了jQuery實現(xiàn)購物車功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-06-06
使用jQuery的load方法設(shè)計動態(tài)加載及解決被加載頁面js失效問題
這篇文章主要介紹了使用jQuery的load方法設(shè)計動態(tài)加載及解決被加載頁面js失效問題,非常不錯，具有參考借鑒價值，需要的朋友可以參考下
2017-03-03
Web前端設(shè)計模式制作漂亮的彈出層
Ben最近在負責(zé)一個購書網(wǎng)站，在網(wǎng)站的首頁上，有一個叫做“最新上架”的板塊，板塊的內(nèi)容比較簡單，只有書籍名稱，作者姓名和上架時間（如圖），當(dāng)初設(shè)計的時候并i沒有過于豐富的構(gòu)思
2010-10-10