深入理解javascript中return的作用


Posted in Javascript onDecember 30, 2013

这里面的return含有一些细节知识:

例如:onClick='return add_onclick()'与 onClick='add_onclick()'的区别

JAVASCRIPT在事件中调用函数时用return返回值实际上是对window.event.returnvalue进行设置。

而该值决定了当前操作是否继续。
当返回的是true时,将继续操作。
当返回是false时,将中断操作。

而直接执行时(不用return)。将不会对window.event.returnvalue进行设置
所以会默认地继续执行操作

详细说明如下:
例如:
当在 <a href="abc.htm" onclick="return add_onclick()">Open</a> 中
如果函数 add_onclick() 返回 true, 那么 页面就会打开 abc.htm
否则, (返回 false), 那么页面不会跳转到 abc.htm, 只会执行你的 add_onclick() 函数里的内容. (add_onclick函数中控制页面转到 abc.htm除外

)
而 <a href="abc.htm" onclick="add_onclick()">Open</a>
不管 add_onclick() 返回什么值, 都会在执行完 add_onclick 后打开页面 abc.htm

另外补充:
onclick事件时就相当于onclick="return true/false"
例:

function check()
{
if(obj.value=="" )
   {
     window.alert("不能为空!");
     obj.focus();
     return false;
   }
     return true;
}

调用方法返回true时才提交表单,反之则不提交,这是submit按钮
------------------------------------------------------------------------------------------

调用js函数不需要return,但是表单却无法提交,所以在js函数中加上一句话
例:

<script language="javascript">
function check()
{
if(obj.value=="" )
   {
     window.alert("不能为空!");
     obj.focus();
     return false;
   }
     document.myform.submit();
     return true;
}
</script>

注:document.myform.submit();要在return true前

 

关于javascript中的 return false和return true
return 是javascript里函数返回值的关键字,一个函数内处理的结果可以使用return 返回,这样在调用函数的地方就可以用变量接收返回结果。return 关键字内任何类型的变量数据或表达式都可以进行返回,甚至什么都不返回也可以比如

function NullReturn(IsNull)
{
if(IsNull==true)
{
return;
}
}

这样写也是可以的,这里的意思是返回空(null)
所以有的时候return 的作用就是用来终止函数执行。
比如
<html>
<head>
<title>return验证测试</title>
<script language="javascript">
function Login_Click()
{
if(document.form1.UsName.value=="")
{
alert('用户名为空');
}
if(document.form1.UsPwd.value=="")
{
alert('密码为空');
}
alert('登陆成功');
}
</script>
</head>
<body>
<form name="form1">
<input type="text" name="UsName" >用户名
<input type="password" name="UsPwd">密码
<input type="button" name="Login" onClick="Login_Click();" >登陆
</form>
</body>
</html>

不加return 的情况
加return
<html>
<head>
<title>return验证测试</title>
<script language="javascript">
function Login_Click()
{
if(document.form1.UsName.value=="")
{
alert('用户名为空');
return;
}
if(document.form1.UsPwd.value=="")
{
alert('密码为空');
return;
}
alert('登陆成功');
}
</script>
</head>
<body>
<form name="form1">
<input type="text" name="UsName" >用户名
<input type="password" name="UsPwd">密码
<input type="button" name="Login" onClick="Login_Click();" >登陆
</form>
</body>
</html>

运行就会发现加return 和不加return 的区别,
最简单的测试办法,上面的两个例子什么都不输入直接登陆,楼就明白了。

不加return的现象是先提示用户名没输入,然后提示密码没输入;加了return之后遇到一个没输入之后就不再继续检测

return false表示返回一个false值,也就是说提交是不成功的,就是不会提交上去。
return true表法返回一个true值,也就是提交了,不管你输入没有输入值,都会提交到action指定页面。

Javascript 相关文章推荐
JS 显示当前日期与时间的代码
Mar 24 Javascript
jQuery EasyUI NumberBox(数字框)的用法
Jul 08 Javascript
jQuery获得IE版本不准确webbrowser的解决方法
Feb 23 Javascript
JS实现点击按钮后框架内载入不同网页的方法
May 05 Javascript
JS实现的自定义网页拖动类
Nov 06 Javascript
一个超简单的jQuery回调函数例子(分享)
Aug 08 Javascript
Bootstrap 模态框实例插件案例分析
Dec 28 Javascript
Vue filter介绍及详细使用
Apr 04 Javascript
详解vuex中mapState,mapGetters,mapMutations,mapActions的作用
Apr 13 Javascript
深入浅析JS中的严格模式
Jun 04 Javascript
学习使用ExpressJS 4.0中的新Router的用法
Nov 06 Javascript
详解js location.href和window.open的几种用法和区别
Dec 02 Javascript
禁止IE用右键的JS代码
Dec 30 #Javascript
js将控件隐藏及display属性的使用介绍
Dec 30 #Javascript
JS的document.all函数使用示例
Dec 30 #Javascript
Jquery插件easyUi表单验证提交(示例代码)
Dec 30 #Javascript
结合JQ1.9通过js正则判断各种浏览器版本的方法
Dec 30 #Javascript
Jquery中&quot;$(document).ready(function(){ })&quot;函数的使用详解
Dec 30 #Javascript
jQuery中bind,live,delegate与one方法的用法及区别解析
Dec 30 #Javascript
You might like
PHP采用get获取url汉字出现乱码的解决方法
2014/11/13 PHP
JS解密入门之凭直觉解
2008/06/25 Javascript
用js解决数字不能换行问题
2010/08/10 Javascript
jQuery版Tab标签切换
2011/03/16 Javascript
javascript截取字符串(通过substring实现并支持中英文混合)
2013/06/24 Javascript
把input初始值不写value的具体实现方法
2013/07/04 Javascript
ie8下修改input的type属性报错的解决方法
2014/09/16 Javascript
Javascript毫秒数用法实例
2015/02/05 Javascript
使用Chart.js图表库制作漂亮的响应式表单
2015/10/28 Javascript
深入浅析JavaScript字符串操作方法 slice、substr、substring及其IE兼容性
2015/12/16 Javascript
修复jQuery tablesorter无法正确排序的bug(加千分位数字后)
2016/03/30 Javascript
jQuery绑定自定义事件的魔法升级版
2016/06/30 Javascript
H5用户注册表单页 注册模态框!
2016/09/17 Javascript
Vue常用指令V-model用法
2017/03/08 Javascript
基于vue实现滚动条滚动到指定位置对应位置数字进行tween特效
2019/04/18 Javascript
vue滚动tab跟随切换效果
2020/06/29 Javascript
[02:37]2015国际邀请赛选手档案—LGD.Xiao8
2015/07/28 DOTA
[06:06]2018DOTA2亚洲邀请赛主赛事第四日战况回顾 全明星赛欢乐上演
2018/04/07 DOTA
Python的函数嵌套的使用方法
2014/01/24 Python
Python类方法__init__和__del__构造、析构过程分析
2015/03/06 Python
在Docker上开始部署Python应用的教程
2015/04/17 Python
浅谈django 重载str 方法
2020/05/19 Python
Python之字典添加元素的几种方法
2020/09/30 Python
巴西女装购物网站:Eclectic
2018/04/24 全球购物
屈臣氏官方旗舰店:亚洲享负盛名的保健及美妆零售商
2019/03/15 全球购物
路由表示做什么用的?在linux环境中怎么来配置一条默认路由?
2013/06/07 面试题
销售代表求职自荐信
2013/10/01 职场文书
教师实习期自我鉴定
2013/10/06 职场文书
大学生职业生涯规划书模版
2013/12/30 职场文书
实践单位评语
2014/04/26 职场文书
环境保护建议书
2014/08/26 职场文书
村创先争优活动总结
2014/08/28 职场文书
离婚财产分配协议书
2014/10/21 职场文书
暑期实践个人总结
2015/03/06 职场文书
2015年感恩母亲节的演讲稿
2015/03/18 职场文书
Windows7下FTP搭建图文教程
2022/08/05 Servers