如何组合多个jquery函数

Question

如果您查看下面的jquery代码,您将看到着名的$(document).ready(function(){启动脚本.我在网上几乎所有jquery代码示例都看到了这一点,我想知道,如果我在一个文件中运行5个不同的代码函数我需要使用$(document).ready(function(){在所有这些函数的开头？

如果不是,我将如何将下面的代码组合成一个页面3次,假装它是3个不同的代码？

<script type="text/javascript" >
 $(document).ready(function(){
  setTimeout(function(){
  $(".flash").fadeOut("slow", function () {
  $(".flash").remove();
      }); }, 2000);
 });
</script>

Answer 1

你应该尽量不要在doc ready块中加入太多内容.是的,你可以有它们的倍数,但是我坚持一个,如果有的话.您也可以将脚本放在关闭正文标记之前,而无需准备好文档.

我建议将代码分解为单独的函数.这样,您可以在不同阶段在整个页面中重复使用它们.然后只需使用doc ready块来触发对该页面init函数的调用.

你也可以$(function(){});用作shorcut $(document).ready(function(){});

<script type="text/javascript" >
 $(function(){
    init();
 });

 function init(){
   someFunction();
   //other init stuff
 }

 function someFunction(){
  setTimeout(function(){
     $(".flash").fadeOut("slow", function () {
     $(".flash").remove();
   }); }, 2000);

 }
</script>

Answer 2

我认为原来的海报是在问他是否必须这样做:

<script>
 $(document).ready(function(){
        func1();
});
</script>
<script>
 $(document).ready(function(){
        func2();
});
</script>

或者,如果他可以这样做:

<script>
 $(document).ready(function(){
      func1();
      func2();
});
</script>

在后面的示例中,有一个脚本和一个文档就绪语句.更清洁.我相信答案是肯定的,你可以在没有任何问题的情况下做到.

Answer 3

问题在于您不了解就绪事件是什么以及为什么需要它。

想象一下，一个页面尚未完全加载，您尝试使用一些 javascript 更改该页面上的某些内容，并且由于您尝试操作的 HTML 元素的代码尚未加载，所以事情会变得很糟糕。

Ready事件解决了这个问题。一旦文档中的所有元素都准备好进行遍历和操作，绑定到就绪事件的任何函数（通常是单个匿名函数）都会被执行。使用内联 JavaScript 被认为是不好的做法。如果您希望事件（单击、悬停等）在您的页面上运行，您应该在 $(document).ready() 函数内调用它。

由于页面仅加载一次，因此绑定到就绪事件的任何函数都只会被调用一次。因此将多个函数绑定到就绪事件没有多大意义。您可以在绑定到该函数的函数中执行所有操作。不过，这不会造成任何损害（只要您了解自己在做什么），因为一旦 DOM 准备好，绑定到就绪事件的每个函数都会被调用。

我不明白你想通过运行同一段代码五次来实现什么目的......所以我无法帮助你。

我希望这个解释可以帮助您解决实际问题。