如何遍歷所有選中的複選框？

我的網站有以下幾點：如何遍歷所有選中的複選框？

<td><input id="inp_0001010030" type="checkbox"></td> 
<td><input id="inp_0001010031" type="checkbox"></td> 
<td><input id="inp_0001010032" type="checkbox"></td> 
<td><input id="inp_0001010033" type="checkbox"></td> 
<td><input id="inp_0001010034" type="checkbox"></td>

這些是動態創建。

這就是在頁面底部的區域外與上述行的形式：

<form action="??" method="??" > 
    <input value="Action" type="submit"> 
     <select id="SelectedAction" > 
     <option value="1">Delete</option> 
     <option value="2">Move</option> 
     </select> 
</form>

行已創建後，我需要有點擊事件表單按鈕去看看每個複選框，然後調用一個javascript函數，其ID和SelectedAnswer的值爲每個複選框，它發現檢查。

請注意，如果有一種方法可以在沒有窗體的情況下執行此操作，那麼它會更好。我對jQuery不夠了解。

這是我能用jQuery輕鬆完成的事嗎？

來源

2011-06-23 JonAndMarie

的可能重複[？jQuery的選擇（每個）所有選中的複選框（http://stackoverflow.com/questions/1083881/jquery-select-each-all-checked-checkboxes） –

*我只是不太瞭解jQuery *：有時間學習更多;）http://docs.jquery.com/Tutorials –

$("input[type=submit]").click(function() { 
    var answer = $("#SelectedAnswer").val(); 
    $("input:checked").each(function() { 
     var id = $(this).attr("id"); 
     alert("Do something for: " + id + ", " + answer); 
    }); 
});

來源

2011-06-23 08:29:50

如果我將按鈕從表格中刪除，那麼該怎麼辦？那裏真的有需要我去做一個表格嗎？ – JonAndMarie

除非您打算使用它將數據發送到服務器，否則該表單沒有用處。 –

你需要添加一個類到你的複選框。在此之後，使用jQuery的.each()方法是這樣的：

HTML

<input type="checkbox" class="list"> 
<input type="checkbox" class="list"> 
<input type="checkbox" class="list"> 
<input type="checkbox" class="list"> 
<input type="checkbox" class="list">

jQuery的

$(document).ready(function() 
{ 
    $("form input[type='submit']").click(function(e) 
    { 
     e.preventDefault(); 

     // This gets the value of the currently selected option 
     var value = $(this).children(":selected").val(); 

     $(".list").each(function() 
     { 
      if($(this).is(':checked')) 
      { 
       $(this).fadeOut(); 
       // Do stuff with checked box 
      } 
      else 
      { 
       // Checkbox isn't checked 
      } 
     }) 
    }); 
});

編輯

請參見上面這個fiddle（代碼）。我只實現了刪除選項（不太好），但使用value變量來檢查選擇哪個選項。如果您希望在提交表單之前發生這種情況，請刪除e.preventDefault()行。

來源

2011-06-23 08:29:27 Bojangles

有沒有某種方式可以讓我可以通過單擊表單中的我的輸入按鈕來觸發此「檢查」。我是否還需要一張表格，因爲我需要獲取選擇列表的值？ – JonAndMarie

請參閱我的編輯，JSFiddle和更新的代碼。 – Bojangles

$('input[type=checkbox]:checked').each(function() { 
    // Do something interesting 
});

來源

2011-06-23 08:31:12 Flimzy

肯定。

您想要做的第一件事是使用$.submit()處理程序將事件處理程序綁定到窗體上的提交事件。接下來你要遍歷每個檢查輸入的元素：

$('form').submit(function() { 
    var action = $('#SelectedAction option:selected', this).val(); 
    $('table input:checkbox:checked').each(function(i){ 
     return doMyCustomFunction(this, action); 
    }); 
}

您的自定義功能（「doMyCustomFunction()」在我的例子），返回值應該是取決於你是否願意提交您的形式或不真或假。

通過一個實際的例子，它可能是這個樣子：

function doMyCustomFunction(el, formAction) { 
    console.info('The element ID is ' + el.id + ' and the action is ' + formAction); 
    return true; 
}

來源

2011-06-23 08:36:37

如何遍歷所有選中的複選框？

回答

相關問題