3

这是我的代码：

<body>
<div align="center">
<b>A<input type="checkbox" name="a" id="check" value="a"></b>
<b>B<input type="checkbox" name="b" id="check" value="a"></b>
<b>B<input type="checkbox" name="c" id="check" value="c"></b>
<b>D<input type="checkbox" name="d" id="check" value="d"></b>
</div>
<table align="center">
<tr>
<td>Text:</td>
<td><input type="text" name="text" id="text"></td>
</tr>
</table>
</body>

我正在尝试：如果（多个）复选框被选中（或选中），该值将被分配到复选框中，如“abcd”或“acd”或“bd”。为此，我编写了 jQuery

<script type="text/javascript">
$(document).click(function(){
if($("#check").attr('checked')){
    $("#text").val(("#check").val());
}
});
</script>

能够一次打印一个 txtbox 值，但不能一次将所有检查值放入文本框中。我哪里出错了？？任何输入将不胜感激。

4

5 回答 5

3

我可能没有正确理解你，但是这个小提琴对你有帮助吗？http://jsfiddle.net/XwGJ9/1/

变化是javascript：

var $textInput = $('#text');
var $checkBox = $('#checkboxes');

$('input').click(function(){
    populateTextInput();
});

function populateTextInput () {
    // empty text input
    $textInput.val('');

    // print out all checked inputs
    $checkBox.find('input:checked').each(function() {
        $textInput.val( $textInput.val() + $(this).val() );
    });
}

编辑：更新

于 2012-07-31T08:07:09.823 回答
3

使用此代码

$('.check').click(function(){
    $("#text").val('');
    $(".check").each(function(){
        if($(this).prop('checked')){

            $("#text").val($("#text").val()+$(this).val());
        }
    });
});​

​</p>

使用此 HTML（使用class而不是idfor abcd）

<div align="center">
<b>A<input type="checkbox" name="a" class="check" value="a"></b>
<b>B<input type="checkbox" name="b" class="check" value="b"></b>
<b>B<input type="checkbox" name="c" class="check" value="c"></b>
<b>D<input type="checkbox" name="d" class="check" value="d"></b>
</div>
<table align="center">
<tr>
<td>Text:</td>
<td><input type="text" name="text" id="text"></td>
</tr>
</table>​

我也鼓励使用 CSS 而不是align="center"

观看现场运行的演示

于 2012-07-31T08:13:05.697 回答
1

因此，我认为您希望将这些值一起附加到文本框中。在这种情况下，请执行以下操作：

<script type="text/javascript">
$(document).click(function(){
if($("#check").attr('checked')){
    var textBoxVal = $("#text").val()+$("#check").val(); // Concatenate the existing textbox value with the checkbox value.
    // Load the resulting value into new var textBoxVal.
    $("#text").val(textBoxVal); // Load the new value into the textbox.
}
});
</script>

我使用原生 JS 只是为了更清楚地说明我在做什么。

于 2012-07-31T08:08:00.787 回答
1

用过这样的东西..可能会帮助你

var checkeditems = $('input:checkbox[name="check[]"]:checked')
                          .map(function() {
                                return $(this).val()
                           })
                            .get()
                            .join(","); 

 $("#text").val(checkeditems);
于 2012-07-31T08:11:22.097 回答
1

如果您一次不想要 a、b、c、d 的倍数，则 onclick 是每个复选框

        var boxes = $("input:checkbox");
        boxes.each(function(idx,elem){
                elem.onclick=function(event){
                    var choices = "";
                    boxes.each(function(idx,elem){
                        choices += elem.checked ? elem.name:"";
                    });
                    $('#text').val(choices);
                }
        });
于 2012-07-31T09:49:52.350 回答