深入理解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 相关文章推荐
Extjs NumberField后面加单位实现思路
Jul 30 Javascript
js/jquery去掉空格,回车,换行示例代码
Nov 05 Javascript
jQuery头像裁剪工具jcrop用法实例(附演示与demo源码下载)
Jan 22 Javascript
js判断主流浏览器类型和版本号的简单实现代码
May 26 Javascript
Vuejs第一篇之入门教程详解(单向绑定、双向绑定、列表渲染、响应函数)
Sep 09 Javascript
js中创建对象的几种方式
Feb 05 Javascript
解决IE7中使用jQuery动态操作name问题
Aug 28 jQuery
JavaScript高阶教程之“==”隐藏下的类型转换
Apr 11 Javascript
Vue+Node服务器查询Mongo数据库及页面数据传递操作实例分析
Dec 20 Javascript
vue ssr+koa2构建服务端渲染的示例代码
Mar 23 Javascript
使用Vant完成通知栏Notify的提示操作
Nov 11 Javascript
vue引入Excel表格插件的方法
Apr 28 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
Terran历史背景
2020/03/14 星际争霸
解析php curl_setopt 函数的相关应用及介绍
2013/06/17 PHP
PHP递归删除目录几个代码实例
2014/04/21 PHP
PHP根据两点间的经纬度计算距离
2014/10/31 PHP
PHP获取当前所在目录位置的方法
2014/11/26 PHP
php使用cookie保存用户登录的用户名实例
2015/01/26 PHP
Laravel程序架构设计思路之使用动作类
2018/06/07 PHP
浅谈Javascript 执行顺序
2013/12/18 Javascript
判断在css加载完毕后执行后续代码示例
2014/09/03 Javascript
JavaScript字符串对象slice方法入门实例(用于字符串截取)
2014/10/16 Javascript
JavaScript判断对象是否为数组
2015/12/22 Javascript
深入浅析JavaScript中的作用域和上下文
2016/03/26 Javascript
Jquery实现select multiple左右添加和删除功能的简单实例
2016/05/26 Javascript
Node.js配合node-http-proxy解决本地开发ajax跨域问题
2016/08/31 Javascript
通过JS获取Request.QueryString()参数的值实现方法
2016/09/27 Javascript
微信小程序开发(二)图片上传+服务端接收详解
2017/01/11 Javascript
javascript实现滑动解锁功能
2017/03/22 Javascript
vue返回上一页面时回到原先滚动的位置的方法
2018/12/20 Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
2020/01/26 Javascript
JavaScript canvas绘制圆弧与圆形
2020/02/18 Javascript
jquery实现手风琴案例
2020/05/04 jQuery
在react-antd中弹出层form内容传递给父组件的操作
2020/10/24 Javascript
微信小程序自定义yPicker组件实现省市区三级联动功能
2020/10/29 Javascript
Python 2.x如何设置命令执行的超时时间实例
2017/10/19 Python
python按行读取文件,去掉每行的换行符\n的实例
2018/04/19 Python
python使用ddt过程中遇到的问题及解决方案【推荐】
2018/10/29 Python
PyQt 图解Qt Designer工具的使用方法
2019/08/06 Python
英国第一独立滑雪板商店:The Snowboard Asylum
2020/01/16 全球购物
.net工程师笔试题
2012/06/09 面试题
本科生详细的自我评价
2013/09/19 职场文书
事业单位公务员的职业生涯规划
2014/01/15 职场文书
生物制药专业自我鉴定
2014/02/19 职场文书
班主任评语大全
2014/04/26 职场文书
2014年小学数学教师工作总结
2014/12/03 职场文书
工作总结之小学教师体育工作范文(3篇)
2019/10/07 职场文书
浅谈Python中的函数(def)及参数传递操作
2021/05/25 Python