-
利用AJAX实现手机号合法性验证及下拉框的省市二级联动
2019-08-01 16:18:55关于AJAX的介绍:...1、前台页面手机号合法性验证(GET方式) <input type="text" id="phone" autocomplete="off" placeholder="输入手机号..."> <span id="span"></sp...关于AJAX的介绍:https://blog.csdn.net/qq_40302790/article/details/97925646
AJAX的局部刷新不仅减轻了浏览器的负担,而且改善了用户对web应用的体验效果。
下面利用AJAX来实现常用的功能操作。1、前台页面手机号合法性验证(GET方式)
<input type="text" id="phone" autocomplete="off" placeholder="输入手机号..."> <span id="span"></span>
document.getElementById("phone").onblur = function() { var ajax = getAJAX(); var phone = this.value; var url = "${pageContext.request.contextPath}/CheckPhone?phone=" + phone + "&time=" + new Date().getTime();// time的作用是防止缓存 ajax.open("GET", url); ajax.send(null); ajax.onreadystatechange = function() { if (ajax.readyState == 4 && ajax.status == 200) { document.getElementById("span").innerHTML = ajax.responseText; } } }
@WebServlet(urlPatterns="/CheckPhone") public class CheckPhoneServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("UTF-8"); String phone = request.getParameter("phone").trim(); response.setContentType("text/html;charset=utf-8"); PrintWriter out = response.getWriter(); final String regex = "1[34578]\\d{9}"; if("".equals(phone)) { out.write("<font size='6' color='red'>请输入手机号</font>"); }else if(phone.matches(regex)) { out.write("<font size='6' color='green'>手机号合法</font>"); }else { out.write("<font size='6' color='red'>手机号不合法</font>"); } out.flush(); out.close(); } }
2、省市下拉框的二级联动(POST方式)
<select id="province" onchange="getCities(this)"> <option>省份</option> <option>四川</option> <option>浙江</option> <option>湖南</option> <option>湖北</option> </select> <select id="city"><option>城市</option></select>
function getCities(select) { var cityElement = document.getElementById("city"); cityElement.length = 1; var province = select.options[select.selectedIndex].value; if ("省份" == province) { return; } var ajax = getAJAX(); var url = "${pageContext.request.contextPath}/GetCities?" + new Date().getTime(); ajax.open("POST", url); // 会自动将请求体的汉字进行utf-8编码 ajax.setRequestHeader("content-type", "application/x-www-form-urlencoded"); // 设置请求头 ajax.send("province=" + province); ajax.onreadystatechange = function() { if (ajax.readyState == 4 && ajax.status == 200) { var xml = ajax.responseXML; var cityArray = xml.getElementsByTagName("city"); for (var i = 0; i < cityArray.length; i++) { var city = cityArray[i].firstChild.nodeValue; var option = document.createElement("option"); option.innerHTML = city; cityElement.append(option); } } } }
@WebServlet(urlPatterns="/GetCities") public class GetCitiesServlet extends HttpServlet { @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("UTF-8"); String province = request.getParameter("province"); response.setContentType("text/xml;charset=utf-8");//注意是text/xml PrintWriter out = response.getWriter(); out.write("<?xml version=\"1.0\" encoding=\"UTF-8\"?>"); out.write("<root>"); switch (province) { case "四川": out.write("<city>成都</city>"); out.write("<city>攀枝花</city>"); out.write("<city>九寨沟</city>"); out.write("<city>绵阳</city>"); break; case "浙江": out.write("<city>杭州</city>"); out.write("<city>宁波</city>"); out.write("<city>绍兴</city>"); out.write("<city>温州</city>"); break; case "湖南": out.write("<city>长沙</city>"); out.write("<city>株洲</city>"); out.write("<city>湘潭</city>"); out.write("<city>衡阳</city>"); break; case "湖北": out.write("<city>武汉</city>"); out.write("<city>恩施</city>"); out.write("<city>赤壁</city>"); out.write("<city>黄冈</city>"); break; } out.write("</root>"); out.flush(); out.close(); } }
-
有搜索功能的下拉框chosen.jquery.js适配手机端
2019-01-14 10:44:07在实现动态生成下拉框数据的...但是在做微信工众号的时候发现这个插件不能显示输入文本框: 各种查资料都没有发现怎么适配手机端,githup上插件文档好像也是介绍已经禁止在android和ip(ad/phone)使用: 但是...在实现动态生成下拉框数据的时候接触到了一个好用的js插件chosen.jquery.js,但是在使用的过程中发现在浏览器中是好用的,能够完美的实现功能,浏览器端界面如下图所示:
但是在做微信工众号的时候发现这个插件不能显示输入文本框:
各种查资料都没有发现怎么适配手机端,githup上插件文档好像也是介绍已经禁止在android和ip(ad/phone)使用:
但是他是在哪禁用的选择?能不能把选择禁用的去掉,于是看了js的源码,找到了禁用的部分,原代码判断如果是iP(od|hone),Android,就返回false,现在只要把false改为true就可以了。如果介绍错误希望大佬们多多指正。
-
QT编辑框问题,下拉框重复动作
2016-04-10 08:06:24QT中在编辑框写文本时,要求回弹出下拉框,也跟着一模一样写,就像手机输入手机号码一样 -
wxpython 下拉框只能选择不能输入_react input Onchange事件不能立刻拿到值,只能拿到上次输入的值...
2020-12-01 20:02:47Input className="search-input" type="text" name="search" placeholder="请输入好友姓名/手机号" value={this.state.searchValue} onChange={this.handleChange}/> handleChange(e){ this.se...第一次使用react,初级问题比较多
代码:
<Input className="search-input" type="text" name="search" placeholder="请输入好友姓名/手机号" value={this.state.searchValue} onChange={this.handleChange}/>
handleChange(e){
this.setState({
searchValue: e.target.value
});
console.log(this.state.searchValue)}
this.state = {
searchValue: "",
};
this.handleChange = this.handleChange.bind(this);拿到的值:
为什么?
react input,并不会立即刷新状态树
setState是异步操作,不能马上拿到state的值,可以在回调中拿到
我点击搜索时,打印出来的时更新的state值就是本次输入的值
在setState回调中拿到值
-
不使用插件实现可输入下拉框_浙江省特种设备使用安全管理分类评价系统操作手册(企业版)...
2020-12-03 11:14:031用户登录1.1 企业统一信用代码登录 打开浏览器,在地址栏输入网址http://yw.zjsei.com:8045/login.jsp, 进入登录界面,已有账号的用户,可以直接输入用户名、密码、验证码直接登录系统。...(用户的手机号码...1用户登录
1.1 企业统一信用代码登录
打开浏览器,在地址栏输入网址http://yw.zjsei.com:8045/login.jsp, 进入登录界面,已有账号的用户,可以直接输入用户名、密码、验证码直接登录系统。
企业登录账户统一用企业统一信用代码,密码默认:Abc12345。
登陆界面
1.2 手机号码登录
用户也可以通过绑定的手机号码,获取短信验证码,登陆系统。(用户的手机号码,需在首次登陆的时候,进行绑定。)
登陆界面
2
首页
2.1
登录成功后,进入首页,企业需进行手机验证激活。如图:
2.2
输入手机号码、手机验证码、单位联系人;输入正确的信息,点击【确认】按钮,手机验证通过后进入主页,如图:
首页主要包括:三项制度的重大隐患数、评价等级标准、评价等级、检验到期与超期未检、消息提醒、通知公告。
三项制度:统计八类特种设备的重大隐患数;
评价等级标准:关于特种设备使用安全管理分类评价的等级标准;
检验到期:关于特种设备下次的检验进行提前提醒;
超期未检:关于特种设备检验未按时检验进行提醒;
消息提醒:主要包括分类评价未评价的,超期未评的,重大隐患未整改的;
通知公告:主要展示监管部门发给企业相关的通知与公告。
3
基本信息
3.1 企业信息
点击二级菜单【企业信息】,进入企业信息页面,主要展示企业的基本信息。如图:
点击【基本信息修改】,可对联系人、电话、邮箱、传真进行修改,如图:
点击【手机号码修改】,可以变更手机号码,需通过新手机号码验证,如图:
3.2 设备信息
点击二级菜单【设备信息】,进入设备信息页面,展示企业的所有特种设备,如图:
在查询页面中输入查询条件,查询字段包括:设备代码、注册代码、设备种类(下拉框)、区域代码(点击选择按钮)、使用状态(下拉框)、风险等级(下拉框)、检验状态(下拉框);查询条件确认后,点击【查询】按钮,列表中显示查询结果,如图:
查看:点击列表中的【查看】按钮,可查看设备的基本信息、扩展信息、检验信息、评价信息,以及该设备的整改状态。如图:
3.3 检验信息
点击二级菜单【检验信息】,进入检验信息页面,展示特种设备的检验信息,如图:
在查询页面中输入查询条件,查询字段包括:设备种类(下拉框)、注册代码、检验日期(时间段)、下次检验日期(时间段)、报告书编号;查询条件确认后,点击【查询】按钮,列表中显示查询结果,如图:
查看:点击列表中的【查看】按钮,可查看检验信息的详细情况,如图:
4
分类评价
4.1 企业自评
点击菜单【分类评价】-【企业自评】,进入企业自评页面,展示企业自评结果,如图:
在查询页面中输入查询条件,查询字段包括:否决项(下拉框)、评价结果、上报情况(下拉框)、评估日期(时间段);查询条件确认后,点击查询,查询列表中显示统计结果。
修改:点击【修改】按钮,可修改企业自评的结果 ,修改后需重新生成评价报告。
上报:点击【上报】按钮,可对企业自评的结果进行上报给监管部门。
查看:点击【查看】按钮,可查看企业自评的结果,包括否决项、单位评价、设备评价、评价报告、存在问题,风险隐患。
企业自评业务流程-新增
1抽查特种设备
根据《特种设备使用安全管理分类评价规范》的抽查规则,抽取相应数量的特种设备(系统自动实现),如图:
2
填写否决项、单位评价、设备评价
抽取设备【确认】后,开始对单位情况、特种设备进行评价,如图:
评价内容主要包括:
否决项、单位评价、设备评价。
1)否决项填写:评价单位、评价日期、组长、组员、评价人员,以及6项否决项,如图。
2)单位评价填写:切换到【单位评价】页面,填写扣分以及存在问题、评价日期、评价人员,如图。
3)设备评价填写:切换到【设备评价】页面,选择特种设备,点击【评价】按钮,弹出一个设备评价表,根据《特种设备使用安全管理分类评价规范》,不同类型的特种设备评价内容有区别,如图(电梯):
4)关于设备的选择:可通过增加设备、手动增加设备两种方式进行增加。
a)点击【增加设备】,增加评价设备,通过设备类型(机电类、承压类)、设备风险等级选择随机抽取设备;如图:
b)若选择固定的设备评价,点击【手动增加设备】,进行选择设备,进行评价。
3
生成评价报告
关于否决项、单位评价、设备评价等内容填写完成后,点击【生成报告】自动生成报告,切换到【评价报告】页面,可查看整个评价情况,如图:
同时可切换到【存在问题】页面,可查看企业、设备存在的问题,如图:
4
上报
在上报之前,评价内容存在问题都可进行修改,点击【修改】按钮,修改后点击【保存】,评价报告需重新再生成一次,点击【生成报告】,确认没问题后,点击【确认上报】。
5
报告打印
企业自评上报后,可对企业自评情况、设备评价情况、以及报告以Word形式下载。
4.2 监管评价
点击二级菜单【监管评价】,进入监管评价页面,页面中展示的是监管部门对本企业验证性评价的内容。
在查询页面中输入查询条件,查询字段包括:否决项、评价结果;查询条件确认后,点击查询,列表中显示查询结果,如图:
详情:点击列表中的【详情】按钮,可查看监管部门对本企业的评价结果,包括否决项、单位评价、设备评价、评价报告、存在问题,风险隐患以及报告下载。
4.3 整改管理
点击二级菜单【整改管理】,进入整改管理页面,页面中展示企业对自身以及设备评价后存在的一些风险隐患,需及时整改处理。
在查询页面中输入查询条件,查询字段包括:类型(下拉框)、计划整改时间(时间段)、整改时间(时间段)整改状态;查询条件确认后,点击查询,列表中显示查询结果,如图:
整改计划:在列表中,选中一条内容,点击【整改计划】,如图:
填写计划时间、整改措施;点击【保存】,整改计划已填写完成。
整改结果确认:在列表中,选中一条内容,点击【整改结果确认】,如图:
填写整改时间、以及整改状态,点击【保存】,这条风险隐患已确认完成。
5
通知公告
点击一级菜单【通知公告】,进入通知公告页面,页面中展示与本企业相关的通知与公告内容。
在查询页面中输入查询条件,查询字段包括:标题、发布日期(时间段);查询条件确认后,点击查询,查询列表中显示统计结果,点击【查看】按钮,可看详情。
登录后可自行右上角下载
或点击原文获取
分类评价系统操作手册
-
请问如果校验世界各国的手机号码格式
2016-08-02 17:43:32我在一个下拉框有全球国家选择。在input框输入手机号码。我该怎么校验这个手机号码是不是属于这个国家的。怎么做方便些。 -
手把手教你注册Pi Network
2021-01-08 00:08:04废话不多说,我们直接进入主题,对Pi Network不了解的,可以先看我公众号的介绍文。...b、Your country下拉框,选择中国+86开头前缀,Your phone number输入你的手机号码,然后点击GO; c、接下来Set up your -
基于SQLite的Android登录APP的实现
2021-01-26 19:01:18基于SQLite的Android登录APP 该登录APP主要包括三个模块: ... ... 个人信息:用户完成登录后...编辑框EditText:输入手机号和密码(或验证码)。 复选框CheckBox:判断是否记住密码。 相对布局RelativeLayout:界面的整体 -
jQuery.validate动态显示提示信息+自定义校验验证的触发验证方式修改
2019-04-15 15:58:29如果选的是手机号就需要验证表单里输入的是否是合法的手机号。并且如果不合法还需给出不同的提示。 在网上找到了添加自定义验证方法的函数(jQuery.validator.addMethod),但是提示信息是固定的。不过最好还是找到... -
Spring框架中自带的文件上传
2017-10-23 23:44:54”后会弹出一个幕布层,中间有一个对话框,会提示用户输入用户名(手机号),然后进行短信验证,验证成功后会显示密码信息。然后用户可以重新登录。 鼠标经过个人菜单:” 显示下拉框: 1 基本资料; 点击个人资料,... -
tp5怎么生成短链接_全景照片转全景短视频
2021-01-03 12:54:41现在抖音,快手等短视频平台非常火爆,怎么能把全景图生成短视频,从而发布到这些平台上呢?今天介绍一种最方便快捷的方法,通过一个专业的在线... 进入今鱼视觉网站后,微信扫码或输入手机号/验证码登录登录页面4. ... -
基本验证控件的区分
2020-06-20 20:02:50验证控件的常见应用 CompareValidator:比较验证 ... 不等于验证:不等于0,比如下拉框选择 单边验证:只指定最大值或最小值,比如出生日期在2000年... RegularExpressionValidator:规定格式,比如邮箱、手机号、中文 -
正则表达式精讲
2013-10-25 11:49:55•测试字符串是否匹配格式:例如测试手机号邮箱是否符合规则 •替换文本内容:可以在一串文本中查找需要的内容进行批量替换 •根据匹配规则从文本中查找需要的内容:例如可以根据输入选择下拉框显示内容; 总之... -
HDDATA基本注意事项
2019-10-01 12:46:112、输入框必填项非空验证3、输入数字,邮箱,手机号等校验4、输入框长度限制5、提交到数据库操作,成功后继续,失败要有提示6、日期类统一显示YYYY/MM/DD HH:MM:DD,YYYY-MM-DD HH:MM:DD 等格式,不允许出现毫秒或00:... -
显示个人信息,例如用户名、真实姓名、宿舍号、学号等,显示之后还需要支持对于数据进行修改,修改之后,要同步修改页面的信息,这需要用到Ajax进行数据的提交,并且进行页面的局部刷新。 2.1.8 我发布的商品模块...
-
常用js大全,javascript校验大全
2009-09-04 17:31:161.61 用下拉框显示月、日,日下拉框根据年月确定 73 1.62 检验租赁合同号为 4 位年份+2 位月份+本月合同的顺序号 2 位 75 1.63 用于多行校验,校验每一行,每一列值是否为空,传入的必须是 . 76 1.64 检查某列得多值... -
i366免费视频电话 v2.2.10.zip
2019-07-12 11:37:00i366免费视频电话在安全性与个人隐私方面,采用用个人手机号和系统自动生成的“V”号双重保护机制;在好友搜索中分“精确搜索”,“模糊搜索”模式用以防止恶意视频邀请及骚扰。 i366免费视频电话产品功能: ... -
风越ASP代码生成器 2.4
2009-05-26 21:22:40不检测 非特殊字符 仅单词字符 仅单词字符空格 仅26个字母 仅中文字符 仅允许整数 仅允许小数 仅日期/时间 仅日期+时间 仅日期 仅时间 仅允许邮箱 仅允许网址 仅允许IP 仅身份证号 仅国内电话 仅国内手机 ... -
风越.net代码生成器v2.9
2009-12-21 14:49:29不检测 非特殊字符 仅单词字符 仅单词字符空格 仅26个字母 仅中文字符 仅允许整数 仅允许小数 仅日期/时间 仅日期+时间 仅日期 仅时间 仅允许邮箱 仅允许网址 仅允许IP 仅身份证号 仅国内电话 仅国内手机 ... -
支持实体键盘输入+鼠标单击输入+触摸输入。 Qt程序嵌入的浏览器中的网页中的文本框等控件的输入。 迷你模式,界面大小随意设置,采用布局自使用任何分辨率。 纯数字键盘模式,自由控制弹出完整输入法面板和数字键盘...
-
在b/s开发中经常用到的javaScript技术整理
2007-01-17 18:21:00B) {alert(\"输入的身份证号 \"+ a[0] +\" 里出生日期不对!\"); return false;} } return true; } 3.7 复选框的全选,多选,全不选,反选 (\'mm\')\">全选 (\'All\')\"> (\'All\')\">... -
ASP.NET开发实战1200例(第1卷).part2
2016-06-11 20:12:37实例072 身份证号从15位升到18位算法 109 第3章 面向对象编程思想 111 3.1 面向对象家族核心——类与类成员 112 实例073 面向对象编程核心——类、对象和引用 112 实例074 绘制家谱——用ASP.NET创建类文件 114 实例... -
ASP.NET开发实战1200例(第1卷).part1
2016-06-11 20:07:19实例072 身份证号从15位升到18位算法 109 第3章 面向对象编程思想 111 3.1 面向对象家族核心——类与类成员 112 实例073 面向对象编程核心——类、对象和引用 112 实例074 绘制家谱——用ASP.NET创建类文件 114 实例... -
ASP.NET开发实战1200例(第1卷).part3
2016-06-11 20:19:00实例072 身份证号从15位升到18位算法 109 第3章 面向对象编程思想 111 3.1 面向对象家族核心——类与类成员 112 实例073 面向对象编程核心——类、对象和引用 112 实例074 绘制家谱——用ASP.NET创建类文件 114 实例... -
迅雷看看播放器(迅雷影音) 4.9.10 官方正式版
2013-08-06 10:57:28搜索下拉框增加影片介绍及子集选择 增加设置“不显示迅雷看看-畅享高清” 增加“视频最小化时暂停播放设置” 清空播放列表增加提示 快进快退设置精确到1s梯度 迅雷看看播放器4.8.10.1033最新更新: ---------------...