JS在onclientclick里如何控制onclick的执行


Posted in Javascript onMay 30, 2016

OnClientClick是客户端脚本,一般使用JavaScript,在客户端,也就是IE中运行,点击后马上执行

OnClick是服务器端事件处理函数,使用C#或者vb.net,在服务器端,也就是IIS中运行,点击按钮后,执行postback,之后再运行。

若想先调用了OnClientClick后就不在调用OnClick事件,应在OnClientClick事件里返回false.若不返回false,在执行了OnClientClick后,会继续调用OnClick事件!

实现方法如下:

<asp:Button ID="btn_Save" runat="server" Text="保存" CssClass="button_bak" OnClientClick="return whetherEmpty();" OnClick="btn_Save_Click" />
//JavaScript实现如下:
<script language="javascript" type="text/javascript">
function whetherEmpty()
{
//alert("KPI信息不能全为空!");
emptflag = false ;
var kpiName = document.getElementById("<%=txt_KPIName.ClientID%>").value;
var jobgoal = document.getElementById("<%=txt_JobGoal.ClientID%>").value;
var weight = document.getElementById("<%=txt_Weight.ClientID%>").value;
var standard = document.getElementById("<%=txt_Standard.ClientID%>").value;
if (kpiName == "" && jobgoal == "" && weight =="" && standard =="")
{
emptflag = true ;
}
if (emptflag)
{
alert("KPI信息不能全为空!");
return false;
}
}
</script>

若是OnClientClick="return whetherEmpty();" 没有return ,在JavaScript里即使return fales,onclick依然会执行!

下面给大家介绍onclientclick和onclick区别

其实有的时候需要客户端和服务端双重校验,为什么这么说呢? 比果说,一个用户名的文本框,在客户端我们通过JS校验,只能输入字母和数字,不能有特殊字符!通常情况下是没有问题的,但是总有那么一丢丢人想方设法的去“搞破坏” ,这个时候就需要进行双重校验了!说白了,就是服务端和客户端都进么校验!

比如说:Button有:OnClick事件和OnClientClick属性,前者一般就是服务端的点击事件!后者则是客户端的点击事件!

我们来做一个测试!在Default.aspx页面中添加如下代码!

<script language="javascript" type="text/javascript">
function buttonClick() {
alert("我是客户端点击事件");
return false; 
}
</script>

页面代码:

<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="些Button是服务端控件,默认使用OnClientClick事件,请禁用浏览器的Js功能体验"
OnClick="Button1_Click" OnClientClick="return buttonClick();" />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</div>
</form>

cs文件代码:

protected void Button1_Click(object sender, EventArgs e)
{
this.Label1.Text = "我是服务端点击事件";
}

大家运行看看是什么效果? 你可能会发现,只弹出了JS中的代码! 没错,这正是我们想要的效果,通过return false 来"屏蔽"服务端的校验!好处是什么? 就是不用刷新页面呀!

Javascript 相关文章推荐
跨浏览器开发经验总结(三)   警惕“IE依赖综合症”
May 13 Javascript
让你的CSS像Jquery一样做筛选的实现方法
Jul 10 Javascript
鼠标拖动实现DIV排序示例代码
Oct 14 Javascript
javascript代码运行不出来执行错误的可能情况整理
Oct 18 Javascript
javascript设置金额样式转换保留两位小数示例代码
Dec 04 Javascript
JQuery设置时间段下拉选择实例
Dec 30 Javascript
js实现类似菜单风格的TAB选项卡效果代码
Aug 28 Javascript
js判断日期时间有效性的方法
Oct 24 Javascript
jQuery图片切换动画特效
Nov 02 Javascript
jQuery Easyui Treegrid实现显示checkbox功能
Aug 08 jQuery
详解VUE调用本地json的使用方法
May 15 Javascript
js实现验证码功能
Jul 24 Javascript
JS获取复选框的值,并传递到后台的实现方法
May 30 #Javascript
值得分享的轻量级Bootstrap Table表格插件
May 30 #Javascript
js获取所有checkbox的值的简单实例
May 30 #Javascript
一览画面点击复选框后获取多个id值的方法
May 30 #Javascript
js判断复选框是否选中及选中个数的实现代码
May 30 #Javascript
JS控制弹出悬浮窗口(一览画面)的实例代码
May 30 #Javascript
限制复选框最多选择项的实现代码
May 30 #Javascript
You might like
thinkphp模板输出技巧汇总
2014/11/24 PHP
php生成唯一的订单函数分享
2015/02/02 PHP
php实现在线通讯录功能(附源码)
2016/05/13 PHP
javascript new 需不需要继续使用
2009/07/02 Javascript
javascript showModalDialog 内跳转页面的问题
2010/11/25 Javascript
判断用户的在线状态 onbeforeunload事件
2011/03/05 Javascript
根据邮箱的域名跳转到相应的登录页面的代码
2012/02/27 Javascript
不用锚点也可以平滑滚动到页面的指定位置实现代码
2013/05/08 Javascript
JQuery实现点击div以外的位置隐藏该div窗口
2013/09/13 Javascript
Javascript动态创建表格及删除行列的方法
2015/05/15 Javascript
JavaScript兼容浏览器FF/IE技巧
2016/08/14 Javascript
js实现把图片的绝对路径转为base64字符串、blob对象再上传
2016/12/29 Javascript
BootStrap中Table隐藏后显示问题的实现代码
2017/08/31 Javascript
微信小程序实现topBar底部选择栏效果
2018/07/20 Javascript
微信小程序学习笔记之目录结构、基本配置图文详解
2019/03/28 Javascript
layui-table表复选框勾选的所有行数据获取的例子
2019/09/13 Javascript
使用vuex存储用户信息到localStorage的实例
2019/11/11 Javascript
使用webpack搭建vue环境的教程详解
2019/12/31 Javascript
python使用scrapy发送post请求的坑
2018/09/04 Python
Python常见的pandas用法demo示例
2019/03/16 Python
节日快乐! Python画一棵圣诞树送给你
2019/12/24 Python
python @propert装饰器使用方法原理解析
2019/12/25 Python
基于Tensorflow:CPU性能分析
2020/02/10 Python
python爬虫基础之urllib的使用
2020/12/31 Python
Links of London官方网站:英国标志性的珠宝品牌
2017/04/09 全球购物
皮尔·卡丹巴西官方商店:Pierre Cardin
2017/07/21 全球购物
HelloFresh奥地利:立即订购烹饪盒
2019/02/22 全球购物
LVMH旗下最大的奢侈品网站平台:24S
2020/05/24 全球购物
排查整治工作方案
2014/06/09 职场文书
禁止酒驾标语
2014/06/25 职场文书
环卫工人节活动总结
2014/08/29 职场文书
个人作风建设心得体会
2014/10/22 职场文书
感谢信格式范文
2015/01/22 职场文书
酒会邀请函
2015/01/31 职场文书
小学二年级班主任工作经验交流材料
2015/11/02 职场文书
英国数字版游戏销量周榜公布 《小缇娜的奇幻之地》登顶
2022/04/03 其他游戏