深入理解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 相关文章推荐
完美兼容各大浏览器获取HTTP_REFERER方法总结
Jun 24 Javascript
JavaScript window.location对象
Nov 14 Javascript
JS实现模拟风力的雪花飘落效果
May 13 Javascript
详解Javascript继承的实现
Mar 25 Javascript
AngularJS 应用身份认证的技巧总结
Nov 07 Javascript
javascript十六进制数字和ASCII字符之间的转换方法
Dec 27 Javascript
jQuery html表格排序插件tablesorter使用方法详解
Feb 10 Javascript
关于ES6的六个小特性(二)
Feb 20 Javascript
JavaScript 用fetch 实现异步下载文件功能
Jul 21 Javascript
jQuery实现数字自动增加或者减少的动画效果示例
Dec 11 jQuery
浅谈Webpack4 Tree Shaking 终极优化指南
Nov 18 Javascript
vue递归实现树形组件
Jul 15 Vue.js
禁止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 远程图片保存到本地的函数类
2008/12/08 PHP
Laravel框架数据库CURD操作、连贯操作总结
2014/09/03 PHP
PHP中Socket连接及读写数据超时问题分析
2016/07/19 PHP
PHP文件打开关闭及读写操作示例解析
2020/08/06 PHP
jquery $.ajax相关用法分享
2012/03/16 Javascript
JavaScript使用setTimeout实现延迟弹出警告框的方法
2015/04/07 Javascript
JS实现的文字与图片定时切换效果代码
2015/10/06 Javascript
Js与Jq获取浏览器和对象值的方法
2016/03/18 Javascript
详解Jquery Easyui的验证扩展
2017/01/09 Javascript
ES6入门教程之Iterator与for...of循环详解
2017/05/17 Javascript
AngularJS实现的获取焦点及失去焦点时的表单验证功能示例
2017/10/25 Javascript
Vue-Router模式和钩子的用法
2018/02/28 Javascript
详解webpack4.x之搭建前端开发环境
2019/03/28 Javascript
Nodejs核心模块之net和http的使用详解
2019/04/02 NodeJs
JS学习笔记之贪吃蛇小游戏demo实例详解
2019/05/29 Javascript
Vue使用JSEncrypt实现rsa加密及挂载方法
2020/02/07 Javascript
对vue生命周期的深入理解
2020/12/03 Vue.js
基于vue的video播放器的实现示例
2021/02/19 Vue.js
[05:06]DOTA2-DPC中国联赛 正赛 VG vs Magma选手采访
2021/03/11 DOTA
Python合并字典键值并去除重复元素的实例
2016/12/18 Python
Python_LDA实现方法详解
2017/10/25 Python
python执行精确的小数计算方法
2019/01/21 Python
django创建简单的页面响应实例教程
2019/09/06 Python
Python图像处理库PIL的ImageGrab模块介绍详解
2020/02/26 Python
使用 Python 读取电子表格中的数据实例详解
2020/04/17 Python
Kate Spade美国官网:纽约新兴时尚品牌,以包包闻名于世
2017/11/09 全球购物
俄罗斯女装店:12storeez
2019/10/25 全球购物
武汉瑞得软件笔试题
2015/10/27 面试题
迅雷Cued工作心得体会
2014/01/27 职场文书
美术指导求职信
2014/03/17 职场文书
合作意向书范本
2014/03/31 职场文书
期末考试复习计划
2015/01/19 职场文书
试用期自我评价怎么写
2015/03/10 职场文书
高中军训感想
2015/08/07 职场文书
机械原理课程设计心得体会
2016/01/15 职场文书
MySql数据库触发器使用教程
2022/06/01 MySQL