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 ...
随机推荐
- mysql中各种日期数据类型及其所占用的空间
DATETIME,8字节: DATE,3字节: TIMESTAMP,4字节: YEAR,1字节: TIME,3字节:
- hive时间日期函数及典型场景应用
1.hive取得当前日期时间: 1.1) 取得当前日期: select current_date(); 1.2) 取得当前日期时间: select current_timestamp(); 1.3) ...
- C#中$的用法
class Program { static void Main(string[] args) { string tbName = "User"; string colName = ...
- python 日常代码 tips
1. 官方示例很多情况是用的列表的形式,bokeh本身不是基于pandas构建的可视化工具,所以它基本上是用的python自己的数据结构字典.列表:我们做数据分析肯定是基于pandas,以上就是做了一 ...
- 2017(4)数据库系统,分布式数据库,NoSQL,反规范化
试题四(共 25 分) 阅读以下关于数据库分析与建模的叙述,在答题纸上回答问题 1至问题 3. [说明] 某电子商务企业随着业务不断发展,销售订单不断增加,每月订单超过了 50 万笔,急需开发一套新的 ...
- 搭建Sonar代码走查环境
1.下载SonarQube并解压(查看检测结果用) 2.根据自己系统下载SonarQube Runner(检测代码用,旧版名叫Sonar Scanner) 3.在自己要检测的工程目录下建立sonar- ...
- 013-mac重做系统后的软件安装
一.系统设置 1.屏幕设置:系统偏好设置→显示器→排列,多个显示器可以排列组合 2.touch bar功能键设置:系统偏好设置→键盘→键盘,触控栏设置 F1 3.程序坞[dock]设置:系统偏好设置→ ...
- 学习了clipboard复制剪切插件的使用
第一步:引入clipboard插件JS <script src="dist/clipboard.min.js"></script> 第二步:在HTML代码加 ...
- python拼接multipart/form-data类型post请求格式
# 最近要做form-data类型接口,大多数这种格式用来文件上传,但是我们公司就是用这种格式传输请求数据. # 百度了一些基本都是files方式的,可是我们需要data=方式的.下面自己来拼接,代码 ...
- fastjson序列化出现StackOverflowError
今天在一个web项目里开发功能,记录日志用到了fastjson的序列化,把类型为RetreatRecord的数据对象序列化后打印出来.结果出现StackOverflowError.先贴出来异常堆栈: ...