Javascript 要列出Jquery的复选框值

大家好，我正在努力实现我的目标，我真的需要一些帮助。 我有一个单一的复选框列表，我需要能够获得值，并能够将它们放入一个列表中

例如，屏幕上的3个复选框可能有更多，用户单击其中一个或所有复选框，我希望能够输出以下内容：

<ul>
<li>Checkbox1 Value</li>
<li>Checkbox2 Value</li>
<li>Checkbox13Value</li>
</ul>

我的HTML将如下所示：

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

  <div id="c_G"> 
  <div>
   <input type="checkbox" value="one_name" checked> 
   <input type="checkbox" value="one_name1"> 
   <input type="checkbox" value="one_name2"> 
  </div> 
  </div> 
 <textarea id="t"></textarea> <!-- UL LIST SHOULD GO HERE -->
 <input type="hidden" id="EXCUR" />
<div id="OP"></div> 

function updateTextArea() {

 var items = $.map($('#c_b :checked'),function(el, ix) {
    return 'Checkbox' + (ix+1) + ' ' + $(el).val();
 });
 if(items.length > 0) {
    $('#t').val('<ul><li>' + items.join('</li><li>') + '</li></ul>');
    $('#EXCUR').val(items.join(' | '))
 } else {
    $('#t').val('');
    $('#EXCUR').val('');
 }
}

$(function() {
  $('#c_b input').click(updateTextArea);
  updateTextArea();
});

这方面的任何帮助都将是巨大的，我只是无法让它工作

非常感谢

Jason

您可以使用jQuery的map（）将所需的值提取到数组中，然后根据需要将数组中的项连接起来

大概是这样的：

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

  <div id="c_G"> 
  <div>
   <input type="checkbox" value="one_name" checked> 
   <input type="checkbox" value="one_name1"> 
   <input type="checkbox" value="one_name2"> 
  </div> 
  </div> 
 <textarea id="t"></textarea> <!-- UL LIST SHOULD GO HERE -->
 <input type="hidden" id="EXCUR" />
<div id="OP"></div> 

function updateTextArea() {

 var items = $.map($('#c_b :checked'),function(el, ix) {
    return 'Checkbox' + (ix+1) + ' ' + $(el).val();
 });
 if(items.length > 0) {
    $('#t').val('<ul><li>' + items.join('</li><li>') + '</li></ul>');
    $('#EXCUR').val(items.join(' | '))
 } else {
    $('#t').val('');
    $('#EXCUR').val('');
 }
}

$(function() {
  $('#c_b input').click(updateTextArea);
  updateTextArea();
});

函数updateTextArea（）{
变量项=$.map（$（'#c#b:checked'），函数（el，ix）{
返回'Checkbox'+（ix+1）+''+$（el.val（）；
});
如果（items.length>0）{
$（“#t'）.val（“
”+items.join（“
”）+”
”）；
$（'#EXCUR'）.val（items.join（'|'））
}否则{
$（'t'）.val（''）；
$（'EXCUR'）.val（''）；
}
}
$（函数（）{
$（“#c#b输入”）。单击（updateTextArea）；
updateTextArea（）；
});

是我认为您正在寻找的东西的一部分，但是如果您回答我上面的评论，我将能够进一步帮助您。

函数updateextarea（）{
    function updateTextArea(){
        var vals = []
        var str="<ul>";
    //iterate over checked boxes
        $("input:checked").each(function(){
            var v = $(this).val()
            vals.push(v)
            str += "<li>" + v + "</li>"
        })
        str+="</ul>"

        $("#EXCUR").val(vals.join("|"));
        $("#t").val(str);
    }
    $(function(){
//bind click to all checkboxes in the page
        $(":checkbox").click(updateTextArea);

    })

var VAL=[]
var str=“
”；
//遍历复选框
$（“输入：选中”）。每个（函数（）{
var v=$（this.val（）
推力阀（v）
str+=“
”+v+“
”
})
str+=“
”
$（“#EXCUR”）.val（vals.join（“|”）；
$（“#t”）.val（str）；
}
$（函数（）{
//绑定单击页面中的所有复选框
$（“：复选框”）。单击（updateTextArea）；
})

当您试图为textarea设置相同的值时，为什么有一个隐藏的输入？您还希望在

中显示什么？您想要“CheckboxID1 checke=true”之类的内容，还是想要“chebk1 one_name”之类的复选框的值？您好，抱歉，我的代码太乱了。我想做的和你做的差不多谢谢你。我需要将复选框的值放入ul，还需要将的值写入隐藏字段，以便稍后保存到db。这是我正在构建的一个报价页，因此ul将向用户显示他们选择的内容，当他们提交时，我将从隐藏字段中提取值。我希望这是有意义的，对不起，我现在太累了，我已经做了一整天了。@Jason我已经更新了小提琴。让我知道你还需要什么。谢谢你在这方面的帮助。你的代码正是我所需要的。我对你感激不尽。还要感谢大家的帮助。