Question

我是Jquery的新手。我的代码有问题，我很困惑在为click事件编写jquery代码时哪种方式是正确的。请帮助我并提前解释感谢！

第一种方法：

<script type="text/javascript">

$('a').click(function(){ 
    alert('you clicked a tag !!! ');
});

</script>

和第二种方法：

<script type="text/javascript">
        $(document).ready(function(){
            $('a').click(function(){ 
                alert('you clicked a tag !!! ');
            });
        });

</script>

当我编写2个测试方法时，只有第二个方法成功并显示警告，但第一个没有做任何事情。另外，我在http://api.jquery.com/click/上进行了回顾，第一个是他们编写样本的方式但成功运行，这让我感到困惑。

<script>
    $("p").click(function () { 
      $(this).slideUp(); 
    });
    $("p").hover(function () {
      $(this).addClass("hilite");
    }, function () {
      $(this).removeClass("hilite");
    });
</script>

Answer 1

第一个没有成功的原因是，尚未加载a元素（假设您的脚本放在您页面的标题中）。

使用$(document).ready(..)可以在DOM准备好进行操作时运行代码，允许jQuery将click事件附加到a - 元素。

通常，在$(document).ready事件触发之前，您不应该开始运行DOM操作代码，以确保您需要的所有内容都可用。

Answer 2

第一种方法是在浏览器到达HTML的那一部分时立即运行代码。

第二种方式，它等待文档准备就绪，然后应用你的代码。

正在发生的是，当以第一种方式编写的代码被执行时，DOM没有完全加载。这意味着可能没有任何<a>元素可以应用您的代码。这就是为什么首选使用第二种方式（以便在DOM准备就绪时执行）。

Answer 3

您需要将所有jquery包含在$（document）.ready（）中，以确保在开始绑定事件之前已处理所有已加载资源和DOM。

但是如果你把你的脚本标签放在HTML页面的底部（没有$（document）.ready（）），jQuery可能会在加载所有html和javascript以及处理DOM时起作用。

最佳做法是将所有jquery包含在$（document）.ready（）

中

Answer 4

在第一个示例中，您尝试在文档未准备好时将click事件绑定到链接。如果您需要执行与DOM相关的任何操作，则必须使用第二个选项。

Answer 5

在第一种方法中，必须在javascript之前首先声明元素。但是在第二种方法中，它并不重要，因为当文档准备就绪时运行javascript，即完成加载。

如何使用Jquery编写点击事件？哪种方式是正确的？

5 个答案: