Question

尝试完成一项非常简单的任务。单击图像，然后显示隐藏的表格行。这是jquery：

$(".trigger_44870").click(function() {
   alert('hi');
  $("#target_44870").show();
});

相关HTML：

    <tr>
      <td colspan='13'><img src='https://feedback.primecaremedical.com:8887/purchasing/_assets/images/plus.png' width='1%' class='trigger_44870'></td>
    </tr>
    <tr style="display: none;" id='target_44870'>
      <td colspan=13>Supporting Data</td>
      <td colspan=13>Supporting Data</td>
    </tr>

每当我点击图像时，jquery函数都不会触发任何内容。

有什么想法吗？

https://jsfiddle.net/o4aqbctn/4/

Answer 1

当调用$（＆＃34; .trigger_44870＆＃34;）。click（...）时，带有class =＆＃34; trigger_44870＆＃34;的图像元素在DOM中还没有，所以触发失败。

将您的脚本代码移至页面底部（</body>之前）或将其置于ondomready类型事件中：

    $( document ).ready(function() {
      $(".trigger_44870").click( function(){
      alert('hi');
        $("#target_44870").show();
      } );
    });

Answer 2

脚本放在文档的头部，代码不包含在$（document）.ready（）中。在文档准备好之前，页面无法安全操作。＆＃34;正如here

所解释的那样

Answer 3

将click事件写入document.ready函数。将整个document.ready函数放在一个新的脚本标记中，并将其放在标记之后。它会工作!!

单击图像时jQuery单击不触发 - 隐藏/显示表行

3 个答案: