js实现简易版validate
需求分析
项目中需要根据选择不同的类型,显示不同的表单,采用的方法是css隐藏显示不需要的表单,但是这个表单字段都是必填的,尝试把不同的表单放在不同的form里,提交时根据不同的类型调用miniui自带的validate方法,结果失败,验证了不同表单的所有字段,所以只能自己实现一个简易版的validate方法,功能是根据不同的类型,判断字段是否为空,如果是空则提示。
代码实现
提示函数
因为每个字段都需要单独判断所以把提示封装成一个函数
function showk(){
mini.alert("表单字段均为必填!");
}
核心功能
根据输入的type拼接上各个字段就能得到type类型表单的字段
function myvalidate (type) {
var name = mini.get(type+"unitname");
var licnum = mini.get(type+"licnum");
...
var fax = mini.get(type+"fax");
var creditcode = mini.get(type+"creditcode");
if(name.getValue()==''){
showk();
return "w";
}
if(licnum.getValue()==''){
showk();
return "w";
}
...
if(email.getValue()==''){
showk();
return "w";
}
if(fax.getValue()==''){
showk();
return "w";
}
if(creditcode.getValue()==''){
showk();
return "w";
} */
if(type=="use"){
var useunittype = mini.get("useunittype")
if(useunittype.getValue()==''){
showk();
return "w";
}
}
}
代码优化
写这么长实在是太傻了,类型后面的字段大部分都是一样的,可以放在一个数组里然后迭代,不同的分别写if就行了,也不知道第一次写的时候为啥没想到,可能这就是菜吧
function myvalidate(type){
var field=["unitname","licnum",...,"fax","creditcode"];
for(var f of field){
var temp = mini.get(type+f);
if(temp.getValue()==''){
showk();
return "w";
}
}
if(type=="use"){
var useunittype = mini.get("useunittype")
if(useunittype.getValue()==''){
showk();
return "w";
}
}
}
总结
还是要多写,不然实际问题来临,手忙脚乱。
js实现简易版validate的更多相关文章
- Javascript基础示例:用JS写简易版贪吃蛇(面向对象)
废话不多说,代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
- 来,我们手写一个简易版的mock.js吧(模拟fetch && Ajax请求)
预期的mock的使用方式 首先我们从使用的角度出发,思考编码过程 M1. 通过配置文件配置url和response M2. 自动检测环境为开发环境时启动Mock.js M3. mock代码能直接覆盖g ...
- 实现简易版德州扑克|学习麻瓜编程以项目为导向入门前端 HTML+CSS+JS
实现简易版德州扑克 1.先上达到网页效果图(简易版德州扑克) 网页分为发牌区和牌池,上面为发牌区,下面是牌池区 2. 代码实现 2.1 HTML和JS代码 ` <link rel="s ...
- 使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包
使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包 前端监控,埋点,数据收集,性能监控 Beacon API https://caniuse.com/beacon 优点,请 ...
- 使用 js 实现一个简易版的模版引擎
使用 js 实现一个简易版的模版引擎 regex (function test() { this.str = str; })( window.Test = ...; format() { let ar ...
- 使用 js 实现一个简易版的 drag & drop 库
使用 js 实现一个简易版的 drag & drop 库 具有挑战性的前端面试题 H5 DnD js refs https://www.infoq.cn/article/0NUjpxGrqRX ...
- 使用 js 实现一个简易版的动画库
使用 js 实现一个简易版的动画库 具有挑战性的前端面试题 animation css refs https://www.infoq.cn/article/0NUjpxGrqRX6Ss01BLLE x ...
- 使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序
使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序 具有挑战性的前端面试题 API JAMstack refs https://www.infoq.cn/article/0NUjpx ...
- 使用 js 实现一个简易版的 async 库
使用 js 实现一个简易版的 async 库 具有挑战性的前端面试题 series & parallel 串行,并行 refs https://www.infoq.cn/article/0NU ...
随机推荐
- 错误提示:未处理的“System.NullReferenceException”类型的异常出现在 system.data.dll 中。 其他信息: 未将对象引用设置到对象的实例。
这种情况的发生一般有3种情况:1.代码中有一个对象没有初始化.例如Form A=new Form();2.连接数据库的问题.连接和打开连接的语句.3.T-SQL语句不正确,引起在访问数据库时有问题.
- Dynamics 365 解决方案导出报错
之前导出解决方案异常,按照CRM社区的方法解决成功,但是没有了解原因,今天看到有朋友解答了原因,也分享给大家 先来看看异常 我那时导出的是default解决方案,这是模拟 导出异常 “业务流程错误”- ...
- 学习ActiveMQ(八):activemq消息的持久化
1. 持久化方式介绍前面我们也简单提到了activemq提供的插件式的消息存储,在这里再提一下,主要有以下几种方式: AMQ消息存储-基于文件的存储方式,是activemq开始的版本默认的消息存储方式 ...
- python 贪吃蛇
#!/usr/bin/python3 ''' 项目分析: -构成 -蛇Snake -实物Food -世界World -蛇和食物属于整个世界 class world: self.snake self.f ...
- Convert List<Entity> to Json String.
public static string ToJson(this object obj, string datetimeformats) { var timeConverter = new I ...
- 在linux环境下部署禅道环境
下载禅道安装包: 1)cd /home/ 2)mkdir app 3)ls 4)cd app/ 5)pwd 6)wget +禅道地址(http://dl.cnezsoft.com/zentao/9.8 ...
- .Net新利器Rider的破解安装与使用
准备 介绍 Rider 是 JetBrains 提供的一款用于 .Net 开发的 IDE,相对于 VS,它显得更加轻量(才 500m 左右),并且不管是提示功能还是流畅度都不逊色于 VS 且某方面可能 ...
- monent API详解
参考链接:https://www.jianshu.com/p/9c10543420de
- box-sizing:border-boxing的使用
<div class="box"></div> .box { margin-top: 200px; margin-left: 200px; backgrou ...
- Random-Forest-Python
1. 近期目标,实现随机森林进行点云分类 1)学习阶段: [干货]Kaggle 数据挖掘比赛经验分享 Kaggle Machine Learning Competition: Predicting T ...