JQuery 和 Javascript 可以在同一个 .js 文件中使用吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18808022/
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
Can JQuery and Javascript be used in the same .js file?
提问by user2780348
I'm trying to create a messaging system that uses ajax that doesn't have to reload when the message is submitted. I have a .js file that uses an onclick to open the form to insert your message and then a differant function to submit the form. Is this not working because I am doing something wrong or because you cant use JQuery and Javascript in the same file.
我正在尝试创建一个使用 ajax 的消息传递系统，该系统在提交消息时不必重新加载。我有一个 .js 文件，它使用 onclick 打开表单以插入您的消息，然后使用不同的函数来提交表单。这不起作用是因为我做错了什么，还是因为您不能在同一个文件中使用 JQuery 和 Javascript。
Here is my code:
这是我的代码：
//I have a button that calls this function with an onclick in my HTML file
function createMessage() {
var form = document.createElement("form");
form.name = "form_input";
form.method = "POST";
form.action = "messages.php";
//I also have a container div in my HTML
container.appendChild(form);
var textarea = document.createElement("textarea");
textarea.name = "message_input";
textarea.action = "messages.php"
textarea.method = "POST";
textarea.cols = 84;
textarea.rows = 16;
textarea.id = "message_input";
form.appendChild(textarea);
var div = document.createElement("div");
div.id = "second_picture";
container.appendChild(div);
var submit = document.createElement("button");
submit.innerHTML = 'Send';
submit.id = 'send_message';
submit.name = 'submit';
form.appendChild(submit);
submit.onclick = submitMessage;
};
function submitMessage() {
$(function() {
$("#send_message").click(function() {
var message = $("input#message_input").val();
var dataString = 'message_input='+ message;
$.ajax({
type: "POST",
url: "messages.php",
data: dataString,
success: function() {
alert('Ok.');
}
});
return false;
});
});
};
回答by Jamund Ferguson
Your problem isn't your jQuery and JavaScript, being on the same page it's your code.
您的问题不是您的 jQuery 和 JavaScript，而是您的代码在同一页面上。
Event Handling Problems
事件处理问题
If you use onclickit lets you apply only 1 handler to an event, so it's considered a best practice to use window.addEventListeneror jquery's event handlers, which let you attach multiple listeners to the same object.
如果您使用onclick它，则只能将 1 个处理程序应用于一个事件，因此使用window.addEventListener或 jquery 的事件处理程序被认为是最佳实践，它允许您将多个侦听器附加到同一个对象。
Event Propagation Problems
事件传播问题
You return falsein the end of your click event handler you're telling the browser to only do this and not let the event bubble up to any other things that might be listening for events on that element. In this case if you're trying to do 2 differentthings when someone presses the submit button (or whatever) it probably won't work because you've added return false. In this case it will probably block a form from submitting for example.
您return false在点击事件处理程序结束你告诉浏览器只有做到这一点，而不是让事件冒泡到可能被监听该元素的事件的任何其他东西。在这种情况下，如果您在有人按下提交按钮（或其他任何东西）时尝试做 2 件不同的事情，它可能无法工作，因为您已经添加了return false. 在这种情况下，它可能会阻止表单提交。
Incorrect DOMReady Wrapping
不正确的 DOMReady 包装
function submitMessage() {
$(function() {
/* ... */
});
}
You don't need to wrap the inside of this function with $(function() {. Usually you wrap the entirefile in that and you can still do that here (if it's needed)
你不需要用$(function() {. 通常你把整个文件都包在里面，你仍然可以在这里做（如果需要的话）
回答by Lajos Arpad
Long story short: You are doing something wrong. jQueryis a Javascriptlibrary, you cannot use jQuerywithout Javascript, therefore the two can be used in the same file.
长话短说：你做错了什么。jQuery是一个Javascript库，你不能使用jQuery没有Javascript，因此两者可以在同一个文件中。
Short story long: Your mistake might be that you try to use jQueryfunctions before jQueryis loaded. Or, you might have not initialized a variable. For example I do not see where you initialized the containervariable. I understand you have a container div, but that's html. We are talking about JS objects now.
长话短说：您的错误可能是您jQuery在jQuery加载之前尝试使用函数。或者，您可能尚未初始化变量。例如，我看不到您在哪里初始化container变量。我知道你有一个容器 div，但那是 html。我们现在谈论的是 JS 对象。
回答by tjons
You can use them in the same file. jQuery IS JavascriptI would not, though, just because it can be kinda confusing. Here is a good link.
您可以在同一个文件中使用它们。jQuery IS Javascript 但我不会，因为它可能有点令人困惑。这是一个很好的链接。
