为什么我的事件处理程序与jQuery绑定而没有启动

Why is my event handler bound with jQuery not firing?

本文关键字：启动 绑定 jQuery 我的 事件处理 程序 为什么      更新时间：2023-09-26

有什么想法为什么这在我的php文档中不起作用吗？当我在jsfiddle上测试这个时，一切都很好。

<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script type="text/javascript">
        $("a").click(function() {
            $("div.info").hide();
            $("div." + this.className).show();
        });
    </script>
</head>
<body>
    <div class="shipping-container">
        <a href="#" class="ups">Show UPS info</a>
        <a href="#" class="fedex">Show Fedex info</a>
        <div class="ups info" style="display:none">the info for ups</div>
        <div class="fedex info" style="display:none">Who let the dogs out</div>
    </div>
</body>

您错过了文档就绪处理程序，请尝试以下操作：

<script type="text/javascript">
    $(function() {
        $("a").click(function() {
            $("div.info").hide();
            $("div." + this.className).show();
        });
    });
</script>

或者，将script标记保持原样，但将其放在文档末尾的</body>标记之前。

您应该确保您的JQuery代码只有在DOM完全加载后才加载，方法是：

$(document).ready(function() {
   $("a").click(function() {
       $("div.info").hide();
       $("div." + this.className).show();
   });
});

您正在运行链接元素之前的脚本。

在jsfiddle中，代码默认放置在加载文档后运行的事件中。使用ready事件在代码中执行此操作：

<script type="text/javascript">
$(document).ready(function(){
  $("a").click(function() {
    $("div.info").hide();
    $("div." + this.className).show();
  });
});
</script>

我认为你应该在你的头中这样做：

<script type="text/javascript">
$(document).ready(function() {
  $("a").click(function() {
      $("div.info").hide();
      $("div." + this.className).show();
});
</script>

这将确保在尝试附加任何事件处理程序之前加载所有DOM对象（尤其是a元素）。

相关文章：