• jQuey中的return false作用是什么?


    jQuey中的return false作用是什么?
    在众多的语句中都有return false的使用,当然对于熟悉它的开发者来说,当然是知根知底,知道此语句的作用,当然也就知道在什么时候使用此语句,不过对于初学者可能未必掌握的很清晰明了,下面通过实例介绍一下return false语句的作用。
    return语句的作用一般是返回函数值,并不再执行下面的语句,直接跳到函数调用的地方,另外还有一个重要的作用,那就是取消默认事件行为的发生。
    代码实例如下: 

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    <!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能够阻止浏览器的默认行为,比如点击超链接就会实现网页跳转就是浏览器的默认行为。下面再看一个表单验证的例子:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    <!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代码如下:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    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返回这个值。
    修改后的代码: 

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
     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进行的详细学习,希望对大家的学习有所帮助。

  • 相关阅读:
    chrome浏览器postman 插件安装
    使用poi解决导出excel内下拉框枚举项较多的问题
    Nginx(三)------nginx 反向代理
    webpack 内存溢出 Allocation failed
    Postman 安装及使用入门教程 (谷歌浏览器插件版)
    jquery 控制 video 视频播放和暂停
    百度编辑器ueditor 光标位置的坐标
    mkdocs 生成帮助文档
    js 日期 相关
    vue-cli3 第三版安装搭建项目
  • 原文地址:https://www.cnblogs.com/whyuyan/p/5109998.html
Copyright © 2020-2023  润新知