首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >在$(文档).ready中必须声明或输入什么?

在$(文档).ready中必须声明或输入什么?
EN

Stack Overflow用户
提问于 2016-09-26 06:27:13
回答 6查看 1.8K关注 0票数 1

我对javascript很陌生,所以我制作了这个线程。我朗读一些帖子。在这篇文章中,是文档准备好的函数inside or outside。如果它在文档之外声明,我可以在另一个JScript中重用/调用它吗?

作为我的标题,文档中的内容应该是什么?

EN

回答 6

Stack Overflow用户

回答已采纳

发布于 2016-09-26 06:50:50

$(document).ready是一个在文档准备就绪时触发的事件。

假设您已经将jQuery代码放在head部分,并试图访问dom元素(锚、img等),您将无法访问它,因为html是从上到下解释的,并且在运行jQuery代码时您的html元素不存在。

为了克服这个问题,我们将jQuery/javascript代码(使用DOM)放置在$(document).ready函数中,当可以访问所有dom元素时,该函数将被调用。

如果您将jQuery代码放在底部(在所有dom元素之后,就在前面),则不需要$(document).ready

参见alert首先调用的示例,它将使您了解ready中应该包含哪些内容。

代码语言:javascript
代码运行次数:0
运行
复制
alert("Without Ready");

$(document).ready(function(){
  alert("With Ready");
});
代码语言:javascript
代码运行次数:0
运行
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

票数 4
EN

Stack Overflow用户

发布于 2016-09-26 06:47:01

.ready确保您的DOM已经准备好,可以进行绑定,因此,将所有函数像events函数一样放入其中,只会在文档的就绪状态下进行引导。普通函数(即非匿名函数)可以在document.ready之外声明,这样您就可以在其他地方重用它。因为这些函数是从要使用的document.ready事件或jquery代码中调用的。

请参阅有关document.ready 这里的更多信息。查看下面的代码片段,以获得一个简短的布局示例

代码语言:javascript
代码运行次数:0
运行
复制
/**
Global function here, which is not called or bind on page load
*/

function alertWindow(message){
  alert ("Window is loaded here with Message: "+message);
  $("#console").text(message);
  }

$(document).ready(function(){
  
  $("#showBtn").click(function(event){
    var ourMessage = $("#message").val();
    alertWindow(ourMessage);
    });
  
  
  });
代码语言:javascript
代码运行次数:0
运行
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" id="message" placeholder="Enter Message" >
<br>
<button id="showBtn">Show Message</button>

<p>
  <h3>Console Here</h3>
<div id="console"></div>
</p>

票数 4
EN

Stack Overflow用户

发布于 2016-09-26 06:34:11

当我们使用document.ready时,所有侦听器和文档中的所有函数只有在页面加载完成后才能工作。因此,例如,如果您将任何侦听器添加到一个按钮中,并在您的页面中执行一些更改,那么最好将其写入document.ready中。

票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/39695995

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档