如何在jQuery检索复选框值

如何使用jQuery获得选中的复选框值，并立即将其放入文本区?

就像下面的代码:

<html>
  <head>
  </head>

  <body>
    <div id="c_b">
      <input type="checkbox" value="one_name" checked>
      <input type="checkbox" value="one_name1">
      <input type="checkbox" value="one_name2">
    </div>  

    <textarea id="t"></textarea>
  </body>
</html>

如果id="c_d"由Ajax更新，altCognito代码的下面部分将不起作用。有什么好的解决办法吗?

当前回答

您也可以返回所有选定的复选框值，以逗号分隔的字符串。这也将使您更容易将其作为参数发送到SQL

下面是一个示例，返回所有选定的复选框值，其名称为“chkboxName”，逗号分隔字符串

这是javascript

function showSelectedValues()
{
  alert($("input[name=chkboxName]:checked").map(function () {
    return this.value;
  }).get().join(","));
}

下面是HTML示例

<html>
  <head>
 </head>
 <body>
  <div>
   <input name="chkboxName" type="checkbox" value="one_name" checked>
   <input name="chkboxName" type="checkbox" value="one_name1">
   <input name="chkboxName" type="checkbox" value="one_name2">
  </div>  
 </body>
 </html>

2011-05-24 20:42:42

其他回答

谢谢altCognito，你的解决方案很有帮助。我们也可以通过使用复选框的名称来做到这一点:

function updateTextArea() {         
   var allVals = [];
   $('[name=chkbox]:checked').each(function() {
      allVals.push($(this).val());
   });
   $('#t').val(allVals)
} 
$(function() { 
    $('#c_b input').click(updateTextArea);
    updateTextArea();
});

2010-06-11 10:11:47

如果你想在任何复选框被选中时立即插入它的值，那么这应该为你工作:

$(":checkbox").click(function(){
  $("#id").text(this.value)
})

2009-04-24 14:55:03

这里有一个替代方案，以防你需要将值保存到一个变量:

var _t = $('#c_b :checkbox:checked').map(function() {
    return $(this).val();
});
$('#t').append(_t.join(','));

(map()返回一个数组，我发现它比textarea中的文本更方便)。

2012-04-04 13:48:17

我有一个类似的问题，这是我如何解决它使用上面的例子:

 $(".ms-drop").click(function () {
        $(function showSelectedValues() {
            alert($(".ms-drop input[type=checkbox]:checked").map(
               function () { return this.value; }).get().join(","));
        });
    });

2013-11-05 20:00:44