$(document).ready(function(){
//global vars
var name = $("#username");
var email = $("#email");
function usernameExists() {
$.get("register.php",{ check: 1, username: name.val(), email: email.val() } ,function(m) {
if(m==1) {
return false;
} else {
return true;
}
});
}
});
Firebug shows the right response when this function is being called, however it returns nothing...(this $.get(...) function has been tested outside the function usernameExists() but without the returns and it worked perfectly).
当这个函数被调用时，Firebug显示正确的响应，但是它没有返回任何东西……(这个$.get(…)函数已经在函数usernameExists()之外进行了测试，但是没有返回，并且运行良好)。
What's the problem and how to solve?
问题是什么，如何解决?
$(document).ready(function(){
//global vars
var form = $("#register");
var name = $("#username");
var email = $("#email");
$.get("register.php",
{ check: 1, username: name.val(), email: email.val() },
// Have this callback take care of the rest of the submit()
function(m) {
if(m==1) {
form.submit(function(){ return false; });
} else {
form.submit(function(){
if(validateName() & validateEmail() & validatePass1() & validatePass2())
return true
else
return false;
});
}
}
);
function validateName(){
// some check here
}
// and other functions
});
1 个解决方案
#1
8
The function you're calling doesn't return anything.
调用的函数不会返回任何内容。
Even if it did try to return the response from your $.get(), it wouldn't work because the call is asynchronous, so by the time the response has been received, whatever code that would have used the return value has likely already executed.
即使它尝试从您的$.get()返回响应，它也不会工作，因为调用是异步的，所以当接收到响应时，使用返回值的代码很可能已经执行了。
What you need to do is call your code from within the $.get() callback.
您需要做的是从$.get()回调中调用代码。
function usernameExists() {
$.get("register.php",{ check: 1, username: name.val(), email: email.val() } ,function(m) {
someOtherFunction(m==1);
});
}
function someOtherFunction(parameter) {
// The parameter will be true or false
// depending on the value of m==1
}
Updated based on your comment.
根据你的评论更新。
Probably better just to bring the $.get() into the submit(), but keeping true to your original idea, this is how it could look.
也许最好将$.get()带入submit()中，但是遵循您最初的想法，这就是它的外观。
form.submit(function(){
// After usernameExists() is called, we need to hand off
// the rest of the execution to that function since
// this one will be done executing before the get()
// response is received
usernameExists();
return false;
});
function usernameExists() {
$.get("register.php",
{ check: 1, username: name.val(), email: email.val() },
// Have this callback take care of the rest of the submit()
function(m) {
if(m==1) {
// do something if true
} else {
// do something if false
}
}
);
}
Explanation of the joys of synchronous vs. asynchronous javascript
解释同步和异步javascript的乐趣
Javascript code normally executes synchronously. That just means that it executes one line at a time, or one line must finish executing before the next line can fire.
Javascript代码通常同步执行。这仅仅意味着它一次执行一行，或者一行必须在下一行可以触发之前完成执行。
var greeting = "hi there"; // set the greeting variable
alert( greeting ); // the alert won't fire,
// until the previous line finished successfully
This makes things very nice and predictable. But there are some exceptions to that rule. One notable exception is AJAX calls.
这使事情变得非常美好和可预测。但也有例外。一个值得注意的例外是AJAX调用。
Your $.get() is an example of an AJAX call. The "A" in AJAX stands for asynchronous, which means that it does not prevent the next line of code from executing.
您的$.get()是AJAX调用的一个示例。AJAX中的“A”表示异步，这意味着它不会阻止下一行代码的执行。
The ramification is that when you do a $.get() that takes (for example) 1 second to complete, whatever code came after the $.get() has long since finished by the time the $.get() has received its response.
其分支是，当您执行$.get()时，需要(例如)1秒完成，在$.get()之后的任何代码在$.get()收到响应时早就完成了。
Take the previous greeting example, but this time using AJAX.
以前面的问候语示例为例，但这次使用AJAX。
var greeting; // will hold the response from our AJAX call
$.get('some/path/to/data.php',
function( m ) {
greeting = m; // populate the greeting variable with the data returned
}
);
alert( greeting ); // Will alert "undefined" instead of the data that was returned
// because the $.get() code above is asynchronous, which allows
// the code below it (the alert in this case) to continue
// executing.
As you can see, the alert( greeting ) would have executed long before the $.get() response was received, because he $.get() is asynchronous, and doesn't pause the execution chain while it is waiting for its data.
如您所见，在收到$.get()响应之前，警报(问候语)就已经执行了，因为$.get()是异步的，在等待数据时不会暂停执行链。
To resolve this, you would place the alert() inside the callback for $.get(), so that it won't run until the response is received.
要解决这个问题，您需要将alert()放在回调中，价格为$.get()，以便在收到响应之前不会运行。
var greeting; // will hold the response from our AJAX call
$.get('some/path/to/data.php',
function( m ) {
greeting = m; // populate the greeting variable with the data returned
alert( greeting ); // Now the alert will give the expected result
// because it is in the callback.
}
);
The upshot is that in your code, once you call $.get(), any remaining code that relies on the response received should take place inside the callback.
结果是，在代码中，一旦调用了$.get()，依赖于接收到的响应的任何剩余代码都应该在回调中进行。
The only way to place your code outside the callback would be to place it in its own function that gets called from inside the callback (like I did with my original answer).
将代码放置在回调函数之外的唯一方法是将它放在它自己的函数中，该函数从回调函数中调用(就像我用原始答案所做的那样)。
Basic layout of how your code should operate:
你的代码应该如何操作的基本布局:
Keep in mind, that you don't necessarily need a separate function for usernameExists(). You could place all that code inside the submit()
请记住，您不一定需要usernameExists()单独的函数。您可以将所有代码放在submit()中
form.submit(function() {
// Check to make sure input is valid **before** you send the AJAX
if(validateName() & validateEmail() & validatePass1() & validatePass2()) {
usernameExists(); // If valid, continue with the usernameExists()
}
return false; // We return false whether or not the content was valid,
// in order to prevent the form from submitting prematurely
});
function usernameExists() {
$.get("register.php",
{ check: 1, username: name.val(), email: email.val() },
// Have this callback take care of the rest of the submit()
function(m) {
// If "m" is less than one, there were no existing users
// so we can go ahead and post the data to the server
if( parseInt(m) < 1 ) {
// Here, you would need to manually do a post to
// submit the data to the server
$.post(url, data, callback, datatype );
}
}
);
}
http://api.jquery.com/jquery.post/
http://api.jquery.com/jquery.post/
#1
8
The function you're calling doesn't return anything.
调用的函数不会返回任何内容。
Even if it did try to return the response from your $.get(), it wouldn't work because the call is asynchronous, so by the time the response has been received, whatever code that would have used the return value has likely already executed.
即使它尝试从您的$.get()返回响应，它也不会工作，因为调用是异步的，所以当接收到响应时，使用返回值的代码很可能已经执行了。
What you need to do is call your code from within the $.get() callback.
您需要做的是从$.get()回调中调用代码。
function usernameExists() {
$.get("register.php",{ check: 1, username: name.val(), email: email.val() } ,function(m) {
someOtherFunction(m==1);
});
}
function someOtherFunction(parameter) {
// The parameter will be true or false
// depending on the value of m==1
}
Updated based on your comment.
根据你的评论更新。
Probably better just to bring the $.get() into the submit(), but keeping true to your original idea, this is how it could look.
也许最好将$.get()带入submit()中，但是遵循您最初的想法，这就是它的外观。
form.submit(function(){
// After usernameExists() is called, we need to hand off
// the rest of the execution to that function since
// this one will be done executing before the get()
// response is received
usernameExists();
return false;
});
function usernameExists() {
$.get("register.php",
{ check: 1, username: name.val(), email: email.val() },
// Have this callback take care of the rest of the submit()
function(m) {
if(m==1) {
// do something if true
} else {
// do something if false
}
}
);
}
Explanation of the joys of synchronous vs. asynchronous javascript
解释同步和异步javascript的乐趣
Javascript code normally executes synchronously. That just means that it executes one line at a time, or one line must finish executing before the next line can fire.
Javascript代码通常同步执行。这仅仅意味着它一次执行一行，或者一行必须在下一行可以触发之前完成执行。
var greeting = "hi there"; // set the greeting variable
alert( greeting ); // the alert won't fire,
// until the previous line finished successfully
This makes things very nice and predictable. But there are some exceptions to that rule. One notable exception is AJAX calls.
这使事情变得非常美好和可预测。但也有例外。一个值得注意的例外是AJAX调用。
Your $.get() is an example of an AJAX call. The "A" in AJAX stands for asynchronous, which means that it does not prevent the next line of code from executing.
您的$.get()是AJAX调用的一个示例。AJAX中的“A”表示异步，这意味着它不会阻止下一行代码的执行。
The ramification is that when you do a $.get() that takes (for example) 1 second to complete, whatever code came after the $.get() has long since finished by the time the $.get() has received its response.
其分支是，当您执行$.get()时，需要(例如)1秒完成，在$.get()之后的任何代码在$.get()收到响应时早就完成了。
Take the previous greeting example, but this time using AJAX.
以前面的问候语示例为例，但这次使用AJAX。
var greeting; // will hold the response from our AJAX call
$.get('some/path/to/data.php',
function( m ) {
greeting = m; // populate the greeting variable with the data returned
}
);
alert( greeting ); // Will alert "undefined" instead of the data that was returned
// because the $.get() code above is asynchronous, which allows
// the code below it (the alert in this case) to continue
// executing.
As you can see, the alert( greeting ) would have executed long before the $.get() response was received, because he $.get() is asynchronous, and doesn't pause the execution chain while it is waiting for its data.
如您所见，在收到$.get()响应之前，警报(问候语)就已经执行了，因为$.get()是异步的，在等待数据时不会暂停执行链。
To resolve this, you would place the alert() inside the callback for $.get(), so that it won't run until the response is received.
要解决这个问题，您需要将alert()放在回调中，价格为$.get()，以便在收到响应之前不会运行。
var greeting; // will hold the response from our AJAX call
$.get('some/path/to/data.php',
function( m ) {
greeting = m; // populate the greeting variable with the data returned
alert( greeting ); // Now the alert will give the expected result
// because it is in the callback.
}
);
The upshot is that in your code, once you call $.get(), any remaining code that relies on the response received should take place inside the callback.
结果是，在代码中，一旦调用了$.get()，依赖于接收到的响应的任何剩余代码都应该在回调中进行。
The only way to place your code outside the callback would be to place it in its own function that gets called from inside the callback (like I did with my original answer).
将代码放置在回调函数之外的唯一方法是将它放在它自己的函数中，该函数从回调函数中调用(就像我用原始答案所做的那样)。
Basic layout of how your code should operate:
你的代码应该如何操作的基本布局:
Keep in mind, that you don't necessarily need a separate function for usernameExists(). You could place all that code inside the submit()
请记住，您不一定需要usernameExists()单独的函数。您可以将所有代码放在submit()中
form.submit(function() {
// Check to make sure input is valid **before** you send the AJAX
if(validateName() & validateEmail() & validatePass1() & validatePass2()) {
usernameExists(); // If valid, continue with the usernameExists()
}
return false; // We return false whether or not the content was valid,
// in order to prevent the form from submitting prematurely
});
function usernameExists() {
$.get("register.php",
{ check: 1, username: name.val(), email: email.val() },
// Have this callback take care of the rest of the submit()
function(m) {
// If "m" is less than one, there were no existing users
// so we can go ahead and post the data to the server
if( parseInt(m) < 1 ) {
// Here, you would need to manually do a post to
// submit the data to the server
$.post(url, data, callback, datatype );
}
}
);
}
http://api.jquery.com/jquery.post/
http://api.jquery.com/jquery.post/