Question

我正在尝试根据是否选中特定复选框来编写多个值的字符串。即。

$('#submit').click(function() {
  if ($('#box1').attr('checked')) {
    $('#MyInput').val('box1 ');
    alert('1');
  }

  if ($('#box2').attr('checked')) {
    $('#MyInput').val('box2 ');
    alert('2');
  }
});

在这种情况下我要寻找的回报是'1 2'，但只有第二个值写在输入字段中。

警报告诉我参数中的两个事件都在触发。还有另一种附加值的方法吗？

Answer 1

.val()不附加..它将值设置为您传递的任何值，覆盖以前的值。

$('#submit').click(function() {

var myInput = $('#MyInput').val('')[0];


if($('#box1').attr('checked')){
    myInput.value += 'box1 ';
    alert('1');
    }

if($('#box2').attr('checked')){
     myInput.value += 'box2 ';
    alert('2');
    }

else {}

});

如果您有多个复选框，您希望将所有值添加到myInput元素中（如果选中它们），则可以向所有这些复选框添加一个类，然后执行

$('#submit').click(function() {
  var myInput = $('#MyInput').val('')[0];
  $('.common-class-to-all:checked').each(function(){
     myInput.value += this.value + ' ';
  });
});

demo http://jsfiddle.net/SQcGq/

Answer 2

我想这是一个错字？在第一个if中，您检查“已检查”值，在第二个if中检查“已检查”属性

如果你使用jQuery 1.6+，你应该使用$('#box1').prop("checked")

检查/修改此演示：http://jsfiddle.net/roberkules/45WgD/

$('#submit').click(function() {

    var values = [];
    $("#box1, #box2").filter(":checked").each(function(i, box){
        values.push($(box).attr("id"));
    });

    $('#MyInput').val(values.join(" "));

}）;

Answer 3

为方框提供类似boxes的类，并使用map()^[docs]方法获取值的集合，将get()^[docs]方法转换为数组，并{{1将它们连接成一个字符串。

然后使用val()^[docs]方法将结果字符串设置为一次。

.join()

编辑：要求使用等于结果ID的字符串。固定。感谢@Bryan的提醒。

Answer 4

您每次都会替换MyInput的值。 .val不会添加输入字段的值，而是替换它。

var value = [];

if ($('#box1').prop('checked')) {
  value.push('box1');
}

if ($('#box2').prop('checked')) {
  value.push('box2');
}

$("#MyInput").val(value.join(' '));

Answer 5

执行$('#MyInput').val('box1 ');会覆盖文本框的值，这就是为什么你只看到第二个值，这应该有效：

$('#submit').click(function() {

  var new_val = '';

  if($('#box1').is(':checked')){
    new_val += 'box1 ';
  }

  if($('#box2').is(':checked')){
    new_val += 'box2 ';
  }

  $('#MyInput').val(new_val);

else {}

});

Jquery：附加表单输入值（.val）

5 个答案: