Question

我现在得到的结果，但我想要的是同样获取checked输入框并输入文本而不只是在jQuery中使用on change事件还有页面加载。如您所见，下面的其中一个复选框已经过检查，但没有输入到输入文本中。请参阅下面的代码：

$(document).ready(function(){
    $checks = $(":checkbox");
    $checks.on('change', function() {
        var string = $checks.filter(":checked").map(function(i,v){
            return this.value;
        }).get().join(",");
        $('#field_results').val(string);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="multiple">
  <input type="text" id="field_results"/><br>

  <input type="checkbox" value="1" checked>1<br>
  <input type="checkbox" value="2">2<br>
  <input type="checkbox" value="3">3
</div>


<div class="multiple">
  <input type="text" id="field_results"/><br>

  <input type="checkbox" value="1">1<br>
  <input type="checkbox" value="2" checked>2<br>
  <input type="checkbox" value="3">3
</div>

Answer 1

您可以轻松地执行此操作：

＆＃13;

$(document).ready(function() {
  $checks = $(":checkbox");
  $checks.on('change', setResults);

  function setResults() {
    var string = $checks.filter(":checked").map(function(i, v) {
      return this.value;
    }).get().join(",");
    $('#field_results').val(string);
  }
  setResults();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="field_results" /><br>

<input type="checkbox" value="1">1<br>
<input type="checkbox" value="2" checked>2<br>
<input type="checkbox" value="3" checked>3

＆＃13;

Answer 2

首先应将值设置为输入，请尝试：

$(document).ready(function() {
  
  $checks = $(":checkbox");
  $('#field_results').val(getCheckedValues());
  $checks.on('change', function(){
    $('#field_results').val(getCheckedValues());
   });

});

function getCheckedValues(){
  $checks = $(":checkbox");
  var valuse = $checks.filter(":checked").map(function(i, v) {
      return this.value;
   }).get().join(",");
  return valuse;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="field_results"/><br>

<input type="checkbox" value="1" checked>1<br>
<input type="checkbox" value="2">2<br>
<input type="checkbox" value="3" checked>3<br>
<input type="checkbox" value="4">4<br>
<input type="checkbox" value="5" checked>5<br>

Answer 3

最简单的方法
您可以使用.trigger（）设置默认值

$checks.trigger('change');

如何使用jquery在输入文本中添加选中的输入框，无论是onload还是onclick

3 个答案: