jQuey中的return false作用是什麼?
在眾多的語句中都有return false的使用,當然對於熟悉它的開發者來說,當然是知根知底,知道此語句的作用,當然也就知道在什麼時候使用此語句,不過對於初學者可能未必掌握的很清晰明了,下面透過實例介紹一下return false語句的作用。
return語句的作用一般是回傳函數值,並不再執行下面的語句,直接跳到函數呼叫的地方,另外還有一個重要的作用,那就是取消預設事件行為的發生。
程式碼實例如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>脚本之家</title> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("a").click(function(){ return false; }) }) </script> </head> <body> <div id="first"> <div id="second"> <a id="third" href=<a href="http://www.jb51.net">http://www.jb51.net</a>>链接</a> </div> </div> </body> </html>
從以上程式碼可以看出,點擊連結之後並沒有跳到http://www.jb51.net首頁,這是因為return false能夠阻止瀏覽器的預設行為,例如點擊超連結就會實現網頁跳轉就是瀏覽器的預設行為。下面再看一個表單驗證的範例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.jb51.net/" /> <title>脚本之家</title> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(":submit").click(function(){ if($("#username").val()=="") { alert("用户名不能为空!"); $("#username").focus(); return false; } if($("#pw").val()=="") { alert("密码不能为空!"); $("#pw").focus(); return false; } }) }) </script> </head> <body> <form action="http://www.jb51.net" name="myform"> <ul> <li>用户名:<input type="text" id="username" /></li> <li>密码:<input type="password" id="pw" /></li> <li><input type="submit" value="提交表单"></li> </ul> </form> </body> </html>
以上程式碼中,每一個判斷語句的最後都添加了return false語句,如果用戶名或者密碼為空的話,則會彈出提示框,如果沒有return false語句的話,那麼儘管還能夠彈出提示框,但表單依然會被提交,因為點擊提交表單就是點擊提交按鈕的預設事件行為。
那為什麼jquery中的return false不起作用,有什麼解決方法?
寫了個表單驗證js程式碼如下:
function CheckUserName(){ var username = $("#username").val(); $.get("b.php",{ name:username}, function (data){ if(data == 1){ $("#warnning").html("<font color=#FF3300>Account is used.</font>"); return false; //为啥不管用捏? } else { $("#warnning").html("<font color=#00CC66>You can register.</font>"); return true; //为啥不管用捏? } } ); }
原因:邏輯沒弄清楚,要將ajax設定為同步的,需要使用$.ajax,$.get預設是異步的,並且不是在回呼函數內return,而是在CheckUserName函數中宣告一個變數來接受回呼函數的回傳值,然後CheckUserName回傳這個值。
修改後的程式碼:
function CheckUserName(){ var username = $("#username").val(); var result=false; $.ajax({async:false//要设置为同步的,要不CheckUserName的返回值永远为false ,url:'b.php',data:{name:username} ,success:function(data){ if(data == 1){ $("#warnning").html("<font color=#FF3300>Account is used.</font>"); result=false; } else { $("#warnning").html("<font color=#00CC66>You can register.</font>"); result=true; } }}); return result;//==========这里才是CheckUserName的返回值,回调函数返回值没有意义 }
OK! 測試一下,沒問題了!
js/jquery中什麼時候用return,什麼時候用return false?這裡也是大家疑惑的地方。
根本的說 return 是函數的回傳結果用, 如果你一個函數需要執行結果那就return 你需要的結果,不需要結果就不用return;
而在jq中有些特殊的用法,例如$().each(function(){return false;});
其中如果不return false就會循環所有元素, 而如果在其中一次return false則不在進行後續的遍歷,跳出循環。
以上就是針對jQuey中的return false進行的詳細學習,希望對大家的學習有所幫助。