Question

我有这样的HTML：

<input type="checkbox" name="choice_shrd_with_me" id="choice{{ forloop.counter }}" value="{{ choice.file_name }}" />

我试图在Javascript中只获取数组中的已检查元素：

var choices = [];
         for (var i=0;i<document.getElementsByName('choice_shrd_with_me').length;i++){
             choices.push(document.getElementsByName("choice_shrd_with_me")[i].value);
         }

以上获取是否选中复选框的所有值。我想只获取选中复选框的值。我怎么能这样做？

Answer 1

只需过滤选中的元素：

var choices = [];
var els = document.getElementsByName('choice_shrd_with_me');
for (var i=0;i<els.length;i++){
  if ( els[i].checked ) {
    choices.push(els[i].value);
  }
}

Answer 2

对于IE＆lt; 9

function getCheckedByName(name){ var chks = document.getElementsByName(name); var results = []; for(var i = 0; i < chks.length; i++){ chks[i].checked ? results.push(chks[i]):""; } return results; }

适用于现代浏览器

function getModernCheckedByName(name){ return Array.prototype.slice.call(document.getElementsByName(name)).filter(function(e){ return e.checked; }); }

工作示例

http://jsfiddle.net/yMqMf/

Answer 3

它的JQuery版本很光滑：

var choices = [];
$("input[name='choice_shard_with_me']:checked").each(function() {
    choices.push($(this).attr('value'));
});

:checked（非常类似于你想要完成的事情）

each()

attr()

Answer 4

对于不需要循环的 vanilla js 解决方案，请使用 querySelectorAll

const choices = document.querySelectorAll("input[name='choice_shard_with_me']:checked")

Answer 5

看起来这个解决方案非常适合 checkbox

但无论如何，如果决定使用 radiobox

更改复选框

简单地可以像下面这样获取radiobox的选中值：

var varName = $('input[name="formItemName"]:checked').val();  // To get selected item of your radiobox

在Javascript中只获取getElementsByName（）中的checked元素？

5 个答案: