Javascript 选中输入复选框后发出警报

我想在类中单击链接

append

html输入复选框后，在单击输入复选框get alert

后选中该复选框

我尝试了以下代码，但不适用于我：

演示：

HTML

jQuery

$（'ho'）。在（'click'，函数（e）{
e、 预防默认值（）；
$（'.hi'）。附加（''）；
})
$（“.hi输入[type=checkbox]”）。在（'单击'，函数（）{
警报（'已选中'）
})

---

如何修复它？

您需要委托，因为绑定时您的元素不存在，或者在元素确实存在后绑定

$(".hi").on('click',"input[type=checkbox]",function () {
    alert('is checked')
})

这样做会将事件处理程序绑定到class=hi的元素/元素，因为它在dom准备就绪时就存在，并且是要将复选框附加到的元素。然后，当事件从您的复选框中冒出并处理它们时，它将侦听事件

另一件事是始终将绑定包装在document.ready函数中，以便在尝试绑定事件处理程序之前，它将等待dom加载

$(function(){
   // your binding code here
})

编辑

$(".hi").on('click',"input[type=checkbox]",function () {
  if(this.checked){
    alert('is checked')
  }
})

使用此

$(".hi").on('click',"input[type=checkbox]",function () {
    if($(this).is(':checked')){
        alert('is checked');
    }
})

您好。

这是解决方案

$('#ho').on('click', function(e){
  e.preventDefault();
  $('.hi').append('<input type="checkbox" id="isAgeSelected"/>');
});
$(".hi").on('click', '#isAgeSelected', function () {
  alert('is checked = ' + this.checked)
});

$（'ho'）。在（'click'，函数（e）{
e、 预防默认值（）；
$（'.hi'）。附加（''）；
});
$（“.hi”）。在（'click'，'isAgeSelected'，函数（）{
警报（'is checked='+this.checked）
});

---

如果您想尝试授权，也可以使用小提琴。。。或者在appender之后绑定，因为每次单击它时都会发出警报。。如果您只希望它在选中时发出警报，那么您需要一个If语句

$(".hi").on('click',"input[type=checkbox]",function () {
    if($(this).is(':checked')){
        alert('is checked');
    }
})

$('#ho').on('click', function(e){
  e.preventDefault();
  $('.hi').append('<input type="checkbox" id="isAgeSelected"/>');
});
$(".hi").on('click', '#isAgeSelected', function () {
  alert('is checked = ' + this.checked)
});