jquery - jquery 函数不适用于按钮标签

Question

我使用<button>标签制作了一个按钮并对其进行了标识。我编写了一个 jQuery 函数，通过其 ID 调用该按钮，但该函数不起作用。如果我将<button>标签切换为<a>，它可以工作。有没有办法使按钮起作用？

这是我的代码（按钮使 div 处于淡出状态并切换到另一个页面，但它甚至不会淡出）。

<div id="page">
     <button id="button1">button1</button>
</div>
<script type="text/javascript">
    $("#button1").click(function(){
      $("#page").fadeout(1000)
    });
</script>

Answer 1

几件事：

将 JS 包装在 doc.ready 调用中：

<script type="text/javascript">
    $(document).ready(function() {
        $("#button1").click(function(){
          $("#page").fadeOut(1000);
        });
    });
</script>

这将确保代码仅在所有元素已加载时运行。如果您在脚本加载之前单击该按钮，则不会发生任何事情。更多信息在这里。

另外，请确保大小写正确。fadeOut()是一个函数，fadeout()不是。如果您打开开发人员工具（例如在 Chrome 中按 F12），它会在您遇到 JS 错误时通知您，这将为您提供一个起点来追踪您的代码有什么问题。