javascript - 选中复选框的触发功能，不使用 .change()

Question

我有一个动态加载的表，其中每一行都有一个复选框选项，分配的 #id 为 1,2 或 3。我需要创建一个函数来显示与复选框的 #id 对应的隐藏 div检查。我目前正在使用 .change() 来触发该功能，但这最终会在取消选中一个框时显示隐藏的 div，这是我不希望发生的。是否有另一种方法可以仅在“选中”而不是“未选中”时触发此功能。见下面的代码:

<tr>
   <td >
      <input id="1" class="link_contact" type="checkbox"/>
   </td>
</tr>
<tr>
   <td >
      <input id="2" class="link_contact" type="checkbox"/>
   </td>
</tr>
<tr>
   <td >
      <input id="3" class="link_contact" type="checkbox"/>
   </td>
</tr>

<div class="1" style="display:none;"> Some Hidden Text</div>
<div class="2" style="display:none;"> Some Hidden Text</div>
<div class="3" style="display:none;"> Some Hidden Text</div>

<script>
$(document).ready(function () {
    $(".link_contact").change(function () {
        $("." + $(this).attr('id')).fadeIn(800);
        $("." + $(this).attr('id')).delay(7000).fadeOut(800);
    });
});
</script>

谢谢， 标记

Answer 1

仅当复选框被选中时才执行操作

$(document).ready(function () {
    $(".link_contact").change(function () {
        if (this.checked) {
            $("." + this.id).stop(true, true).fadeIn(800).delay(7000).fadeOut(800);
            $('.dialog_warning').fadeOut(800);
        }
    });
});

演示:Fiddle