Javascript $（）。未准备好文档时绑定无法工作_Javascript_Jquery_Html_Event Handling

Javascript $（）。未准备好文档时绑定无法工作

javascript jquery html

Javascript $（）。未准备好文档时绑定无法工作,javascript,jquery,html,event-handling,Javascript,Jquery,Html,Event Handling,使用$.bind时是否需要使用$document.ready HTML部分： <head> <script type="text/javascript" src="jquery-1.10.2.min.js"></script> <script type="text/javascript" src="test.js"></script>

使用$.bind时是否需要使用$document.ready

HTML部分：

<head>
    <script type="text/javascript" src="jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="test.js"></script>
    <link rel="stylesheet" href="test.css" type="text/css">
</head>
<body>
<div style=''>
    <input type="text" id="sendie" value="Type your reply here and press Enter" class="inputBox"/>
</div>
</body>

这是我用来测试的两段代码。如果我用$document.ready包装js部件，它仍然可以正常工作

我担心的原因是，我将在不同的元素上进行大量的键盘+鼠标绑定，如果我必须一直编写$。ready，这将是非常乏味的，尽管我不介意这样做，但我只是好奇

我浏览了上面的帖子，它说，$.ready是没有必要的，如果extjs文件是在body标记之前添加的，但是我仍然不能没有它。请帮助。

此表达式

$("#sendie")

。。。尝试在现有DOM中查找ID等于“sendie”的元素。如果它还不在那里，结果jQuery对象将是空的——并且相应的元素是否会出现在那里，根本不重要，因为jQuery不能预测未来

所以你的选择是

。。。使用init方法将调用的所有函数收集到一个更大的函数或对象中，然后在dom.ready上调用这个大函数object.init。这是不必要的，jQuery在幕后就是这么做的，但它可能会帮助您更好地组织代码

。。。使用委托：将所有事件处理程序绑定到文档，然后在该“元处理程序”中路由操作。同样，只有当这个元处理程序是一个非常薄的“路由器”层，并且真正的操作在相应的模块/方法中完成时，这才有帮助。

您的问题与绑定无关-在文档完全加载之前，jQuery选择不起作用。原因很简单：在脚本标记中直接执行的代码在加载时就被执行。因为它在头部，它在身体的任何内容物之前。因此，在执行代码时，还没有sendie，因此无法设置其单击处理程序。

如果在页面末尾包含js脚本，则不需要它，因此DOM元素已加载：

<script type="text/javascript" src="test.js"></script>
</body>

何时调用js？将test.js include移动到正文的末尾，即在$document.ready不是必需的，但是为了绑定工作，元素应该存在。因此，您必须在呈现元素后执行脚本。您需要$document.ready，因为一旦DOM就绪，就会调用它。无法绑定到尚不存在的元素。如果你的代码在元素之后，那么它们就会存在，但是如果你的代码在元素中，那么你就需要它。如果你害怕的话，你不需要单独包装所有的东西。只需将所有内容放在一个document.ready事件中，$document.bindready，…，有一个快捷方式，即$document.bindready。。。。所以所有东西都可以包装在一个巨大的$function{/*代码中；。没有太多额外的代码@约翰尼斯绑定所有事件处理程序“！=”绑定就绪事件处理程序'，如果您使用第二种方法。对于第一个，是的，当然，如果只有一个文件。如果它不止是一个文件，那么可以为每个文件定义一个模块，然后在这个更大的函数中调用所有这些模块的init，这些模块可能位于另一个文件中，也可能不位于另一个文件中@raina77ow-你能给我一些链接，让我了解这两种选择吗。通过在模块模式的@MayurBuragohain之前包含js文件，问题就解决了。我建议检查Addy Osmani编写的文件，事实上，阅读它无论如何都是值得的。对于事件委派，请检查-一般来说，更多的是关于JS的，但我想知道细节在这种情况下非常有用。@raina77ow谢谢。。！！

<script type="text/javascript" src="test.js"></script>
</body>