前端相关校验

1,文本框失去焦点时若有值则trim

Js代码  

  1. $('#identityTF').blur(function (e) {  
  2.             console.log('blur');  
  3.             //去掉首尾的空格  
  4.             var eventTarget = e.srcElement || e.target || e.toElement;  
  5.             if (eventTarget) {  
  6.                 var identityTmp = eventTarget.value;  
  7.                 identityTmp = util.trim(identityTmp);  
  8.                 if (identityTmp) {  
  9.                     eventTarget.value = identityTmp;  
  10.                 }  
  11.             }  
  12. })  

 

 

2,文本框聚焦或有键按下时清除错误样式

Js代码  

  1. /*** 
  2.          * 清除错误样式 
  3.          * @param event 
  4.          */  
  5.         var cleanErrorStyle = function (event) {  
  6.             var errorClass = 'has-error-inp';  
  7.             var eventTarget = event.srcElement || event.target || event.toElement;  
  8.             $(eventTarget).removeClass(errorClass);  
  9.         };  
  10.         $('input[type=text]').keydown(cleanErrorStyle).focus(cleanErrorStyle);  

 

 

 

 

3,如何在事件处理方法中获取事件源(控件)

方式一:

var eventTarget = e.srcElement || e.target || e.toElement;

方式二:

var val=$(this).val();

 

时间: 2024-11-01 10:59:54

前端相关校验的相关文章

使用Javascript监控前端相关数据的代码_javascript技巧

本篇文章介绍了Javascript监控前端相关数据,项目开发完成外发后,没有一个监控系统,我们很难了解到发布出去的代码在用户机器上执行是否正确,所以需要建立前端代码性能相关的监控系统. 所以我们需要做以下的一些模块: 一.收集脚本执行错误 function error(msg,url,line){ var REPORT_URL = "xxxx/cgi"; // 收集上报数据的信息 var m =[msg, url, line, navigator.userAgent, +new Dat

QCon San Francisco 2016 前端参会总结

11 月初有幸参加了在美国旧金山举行的 Qcon 会议,会议之余在小伙伴们的各路关系中拜访了一些美国的科技公司.此行受益颇多,这里谈一下自己的所见.所闻以及自己的感受. 会议内容 会议内容覆盖了前端.设计.容器.微服务.devops.JAVA 等等,内容非常的丰富,这里选择几个前端相关的场做下分享. Webpack: The One Build Step To Rule Them All webpack 自诞生以来席卷全球,为我们的开发带来了无限可能,相信很多童鞋都在使用 webpack,web

AngularJS入门教程之表单校验用法示例_AngularJS

本文实例讲述了AngularJS表单校验用法.分享给大家供大家参考,具体如下: 表单数据的校验对于提高WEB安全性意义不大,因为服务器接收到的请求不一定来自我们的前端页面,有可能来自别的站点,黑客可以自己做一个表单,把数据提交到我们的服务器(即跨站伪造请求),这样就绕过了前端页面的校验.如果对HTTP协议比较熟,甚至还可以在程序中手动构造一段HTTP请求发到服务器,所以服务器端的数据校验绝对是必不可少的. WEB前端数据校验的意义在于改善用户体验,用户不用等到將数据提交到服务器后才知道哪些数据是

jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法_jquery

先给大家分享数据校验显示效果 Web前端数据校验组件 Web项目中客户端与服务端的交互离不开Form表单,Form表单中最常用的元素莫过于input标签,input标签首先要用的肯定是text文本框啦! input文本框允许用户任意输入,难免会会有用户输入一些不符合规定的数据,此时,在提交之前对数据校验是很有必要的,如果等到提交到服务端再校验就会大大降低用户体验啦. 前端校验有很多现成的组件,比较好用的有 EasyUI 的 validatebox 插件,提示界面做的相当友好,只是validate

jQuery插件EasyUI校验规则 validatebox验证框_jquery

Web前端数据校验组件 Web项目中客户端与服务端的交互离不开Form表单,Form表单中最常用的元素莫过于input标签,input标签首先要用的肯定是text文本框啦! input文本框允许用户任意输入,难免会会有用户输入一些不符合规定的数据,此时,在提交之前对数据校验是很有必要的,如果等到提交到服务端再校验就会大大降低用户体验啦. 前端校验有很多现成的组件,比较好用的有 EasyUI 的 validatebox 插件,提示界面做的相当友好,只是validatebox 默认提供的校验规则比较

MDA数据校验规则定义

及时有效的数据校验可以给用户良好的体验,避免用户输入半天,提交的时候,才告诉用户输入的数据有若干的问题.更悲催的是有时候,还会出现数据丢失的现象,这个时候,用户已经眼都红了. Tiny MDA中集成了JQuery Validate用来进行前端数据校验,当然,为了避免恶意用户手工提交数据或禁用JS.动态修改JS等方式进行攻击,后台数据校验也是必须的. Tiny框架提交的数据校验属于一次定义,前后台同时启作用.在良好用户体验及数据安全方面取得平衡. 目前 ,集成的数据校验规则与JQuery Vali

前端开发工程师如何在2013年里提升自己

这篇文章其实文字部分不多,强烈推荐大家直接阅读原文,我这里主要是把文章里介绍的PPT简述一下,方便大家寻找. 大部分人非常在意个人在技术上的提升.但是保持对新技术的了解是一项不小的挑战, 毕竟我们需要的信息在数量上过于庞大.2012年里,伴随着前端发展的是大量的革命性突破和对前端的重新定义. 我们在实践的路上飞速前进,具体的进步体现在使用抽象化,优秀的代码质量,维护性上的提升以及更好的性能.如果你实在忙到没有时间来跟上最新的技术,不用担心. 随着假日的来临,我们就有了一些空闲的时间可以自己支配,

5个前端工程师必备的最佳开发工具

 开发工具-前端工程师必备工具"> 原文作者 Arnaud Breton 为前端工程师,特别专注于前端和使用者经验,这篇文章出自于mention blog.以下内容由作者以第一人称撰写. 过去几年一直不断地提到 Web 应用新世代的成长,这些 App 内容变得越来越丰富,带动了前端整体的复杂度大幅增加. 像是 Backbone(藉由提供模型).AngularJS 和 EmberJS 框架都是创造新 App 非常好的框架,增强了所有 Web 的功能;同时,Web 程式语言 Javascrip

前端安全之XSS攻击

 XSS(cross-site scripting跨域脚本攻击)攻击是最常见的Web攻击,其重点是"跨域"和"客户端执行".有人将XSS攻击分为三种,分别是: 1. Reflected XSS(基于反射的XSS攻击) 2. Stored XSS(基于存储的XSS攻击) 3. DOM-based or local XSS(基于DOM或本地的XSS攻击) Reflected XSS 基于反射的XSS攻击,主要依靠站点服务端返回脚本,在客户端触发执行从而发起Web攻击.