深入理解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 相关文章推荐
JavaScript创建类/对象的几种方式概述及实例
May 06 Javascript
使用jQuery动态加载js脚本文件的方法
Apr 03 Javascript
jQuery的deferred对象详解
Nov 12 Javascript
无缝滚动的简单实现代码(推荐)
Jun 07 Javascript
BOM系列第一篇之定时器setTimeout和setInterval
Aug 17 Javascript
vue调用高德地图实例代码
Apr 28 Javascript
浅谈Vue.js 组件中的v-on绑定自定义事件理解
Nov 17 Javascript
AngularJS实时获取并显示密码的方法
Feb 06 Javascript
angularjs 缓存的使用详解
Mar 19 Javascript
微信小程序实现弹出菜单
Jul 19 Javascript
浅谈关于JS下大批量异步任务按顺序执行解决方案一点思考
Jan 08 Javascript
Angular中innerHTML标签的样式不起作用的原因解析
Jun 18 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上传apk后自动提取apk包信息的使用(示例下载)
2013/04/26 PHP
PHP中ltrim()函数的用法与实例讲解
2019/03/28 PHP
PHP swoole和redis异步任务实现方法分析
2019/08/12 PHP
PHP快速导出百万级数据到CSV或者EXCEL文件
2020/11/27 PHP
小试JQuery的AutoComplete插件
2011/05/04 Javascript
解析Jquery取得iframe中元素的几种方法
2013/07/04 Javascript
jquery教程限制文本框只能输入数字和小数点示例分享
2014/01/13 Javascript
javascript基于HTML5 canvas制作画箭头组件
2014/06/25 Javascript
Javascript代码实现仿实例化类
2015/04/03 Javascript
基于jQuery实现简单的折叠菜单效果
2015/11/23 Javascript
纯JS实现可拖拽表单的简单实例
2016/09/02 Javascript
用jQuery的AJax实现异步访问、异步加载
2016/11/02 Javascript
AngularJS Phonecat实例讲解
2016/11/21 Javascript
JS中BOM相关知识点总结(必看篇)
2016/11/22 Javascript
JS实现PC手机端和嵌入式滑动拼图验证码三种效果
2017/02/15 Javascript
jquery实现用户登陆界面(示例讲解)
2017/09/06 jQuery
ajax请求data遇到的问题分析
2018/01/18 Javascript
vue双向数据绑定知识点总结
2018/04/18 Javascript
详解创建自定义的Angular Schematics
2018/06/06 Javascript
详解jenkins自动化部署vue
2019/05/14 Javascript
vue读取本地的excel文件并显示在网页上方法示例
2019/05/29 Javascript
vue实现导航标题栏随页面滚动渐隐渐显效果
2020/03/12 Javascript
Python实现Dijkstra算法
2018/10/17 Python
django orm 通过related_name反向查询的方法
2018/12/15 Python
python爬虫URL重试机制的实现方法(python2.7以及python3.5)
2018/12/18 Python
python opencv将图片转为灰度图的方法示例
2019/07/31 Python
python异步Web框架sanic的实现
2020/04/27 Python
浅谈keras中Dropout在预测过程中是否仍要起作用
2020/07/09 Python
Python 操作SQLite数据库的示例
2020/10/16 Python
销售工作岗位职责
2013/12/24 职场文书
绿化先进工作者事迹材料
2014/01/30 职场文书
爽歪歪广告词
2014/03/20 职场文书
父亲婚礼答谢词
2015/01/04 职场文书
2015年12.4全国法制宣传日活动总结
2015/03/24 职场文书
90条交通安全宣传标语
2019/10/12 职场文书
python plt.plot bar 如何设置绘图尺寸大小
2021/06/01 Python