Question

我正在添加多个这样的复选框：

$(".btn-sample").on("click", function() {
  $(".container").append(
    '<input class="check-sample" type="checkbox" 
    value="'+check_value+'"/>'
  );
});

我的问题是我的其他按钮无法获得下面新复选框的值：

 $(".show-checkbox").click(function() {
   var arr = [];
   $('.check-sample:checked').each(function () {
       arr[i++] = $(this).val();
   });
   console.log(arr);
 });

感谢您提前帮助！

Answer 1

对于动态添加的元素，请尝试以下方法：

$("body").on("click",".btn-sample", function() {
  $(".container").append(
    '<input class="check-sample" type="checkbox" 
    value="'+check_value+'"/>'
  );
});

Answer 2

您应为input[type=checkbox]指定.container选择器。因为您要将复选框附加到此div，并且它与您的小提琴具有不同的大小写。

$(".btn-sample").on("click", function() {
  var check_value = Math.floor(Math.random() * 10);
  $(".container").append(
    '<input class="check-sample" type="checkbox" value="'+check_value+'"/>'
  );
});
 $('#getValue').click(function () {
       $('.container input[type=checkbox]:checked').each(function () {
           console.log($(this).val()); 
       });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div class = "container"></div>
<button type="button" class="btn-sample">Append</button>
<button type="button" id="getValue">Get Value</button>

Answer 3

您需要访问新创建的元素作为.container的子元素，这是一个名为＆＃34;委托的过程。＆＃34;

通过jQuery审核关于事件委派的this document。

您还可以查看我做过一段时间的this fiddle。

简而言之，您必须首先引用父元素。

Answer 4

试试这个：

$(document).on('click', '.show-checkbox', function () {
   var arr = [];
   $('.check-sample:checked').each(function () {
       arr[i++] = $(this).val();
   });
   console.log(arr);
 });

如何显示future复选框元素的值？

4 个答案: