jQuery 在外部 JavaScript 中不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6079811/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery not working in external JavaScript
提问by xyz
I am new to jQuery and am stuck at some strange issue. I am using jQuery's change
and click
methods. They are working fine when used in my HTML file in the <script>
tag.
我是 jQuery 的新手,并且遇到了一些奇怪的问题。我正在使用 jQuerychange
和click
方法。在<script>
标签中的HTML 文件中使用时,它们工作正常。
Like:
喜欢:
<script>
$("select,input").change(function ()
{
// My code and some alerts
});
</script>
When I copied the same in external JavaScript code without <script>
and imported that in my HTML it was not at all working.
当我在外部 JavaScript 代码中复制相同的代码<script>
并将其导入到我的 HTML 中时,它根本不起作用。
Are there any changes which are needed to use jQuery in external JavaScript code?
在外部 JavaScript 代码中使用 jQuery 是否需要进行任何更改?
PS: Some other non-jQuery functions present in same external JavaScript code are successfully called from HTML.
PS:在相同的外部 JavaScript 代码中存在的一些其他非 jQuery 函数可以从 HTML 成功调用。
回答by John Green
First off, you don't want a <script> tag in an external JavaScript file, if that's how I'm reading your post.
首先,您不希望在外部 JavaScript 文件中使用 <script> 标签,如果这就是我阅读您的帖子的方式。
The trick with jQuery is that your code is set to execute immediately.
jQuery 的诀窍在于您的代码被设置为立即执行。
You want to wrap your script so that it loads when the document is ready, in something like:
您想包装您的脚本,以便在文档准备好时加载它,例如:
$(document).ready(function(){
$("select,input").change(function ()
{
// My code and some alerts
})
});
Andyou want to make sure that your file is loaded after jQuery (otherwise the $ global will not be set).
并且您要确保在 jQuery 之后加载您的文件(否则将不会设置 $ global )。
Additions:
补充:
Here is what your HTML should look like:
您的 HTML 应该如下所示:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="jscript/myExternalJs.js"></script>
Here is what your JavaScript code should look like (note there is no script tag inside the JavaScript file):
以下是您的 JavaScript 代码的外观(请注意,JavaScript 文件中没有脚本标记):
$(document).ready(function(){
$("select,input").change(function ()
{
// My code and some alerts
})
// Other event handlers.
});
As far as your other script... it sort of depends on what you're doing. The most important thing is to not try to hook event listeners up to objects that don't yet exist, which is why we use document.ready
.
至于你的其他脚本......这取决于你在做什么。最重要的是不要尝试将事件侦听器与尚不存在的对象挂钩,这就是我们使用document.ready
.
回答by dtbarne
Did you make sure jquery is defined before your own jquery code?
您是否确保在您自己的 jquery 代码之前定义了 jquery?
You should also make sure the DOM is ready when dealing with jquery:
在处理 jquery 时,您还应该确保 DOM 已准备就绪:
$(document).ready(function() {
$("select,input").change(function() {
// my code and some alerts
});
// more code here if needed, etc.
});