这是我的代码:
<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 < / p>
<script type="text/javascript">
$(document).click(function(){
if($("#check").attr('checked')){
$("#text").val(("#check").val());
}
});
</script>
能够一次打印一个txtbox值,但无法一次将所有选中的值放入文本框中。 哪里出错了?任何投入都会受到赞赏。
答案 0 :(得分: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() );
});
}
修改:已更新
答案 1 :(得分:3)
使用此代码
$('.check').click(function(){
$("#text").val('');
$(".check").each(function(){
if($(this).prop('checked')){
$("#text").val($("#text").val()+$(this).val());
}
});
});
使用此HTML(使用class
代替id
代表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"
答案 2 :(得分: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只是为了让我更清楚我正在做的事情。
答案 3 :(得分:1)
曾经使用过这样的东西..可能会帮到你
var checkeditems = $('input:checkbox[name="check[]"]:checked')
.map(function() {
return $(this).val()
})
.get()
.join(",");
$("#text").val(checkeditems);
答案 4 :(得分: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);
}
});