//验证用户名
function checkName(){
var name = document.getElementById("name").value;
if(name == null || name == ""){
alert("用户名不能为空");
return false;
}else{
return true;
}
}
//验证密码
function checkPassword1(){
var password = document.getElementById("password1").value;
if(password == null || password == ""){
alert("密码不能为空");
return false;
}else if(password.length < 6 || password.length > 16){
alert("密码必须在6到16个字符内");
return false;
}else{
return true;
}
}
//验证密码是否相等
function checkPassword2(){
var password1 = document.getElementById("password1").value;
var password2 = document.getElementById("password2").value;
if(password2 == null || password2 == ""){
alert("不能为空");
return false;
}else if(password1 != password2){
alert("两次输入密码不一致");
return false;
}else{
return true;
}
}
//判断电话号码
//number:要判断的文本框,resultStr:返回的消息存放处
function checkNumber(number,returnStr){
var num = document.getElementById(number).value;
var re = /^[0-9,]*$/; //验证只能为数字的正则表达式
if(!re.test(num)){
document.getElementById(returnStr).innerHTML="<font color='red'>电话只能输入数字</font>";
document.getElementById(number).focus(); //设置文本框得到光标
return false;
}else if(num.length < 8 || num.length > 12){//如果字符的长度小于0,或者大于11
document.getElementById(returnStr).innerHTML="<font color='red'>电话不能为空,并且不能超过8-12位字符</font>";
document.getElementById(number).focus(); //设置文本框得到光标
return false;
}else {
document.getElementById(returnStr).innerHTML="<font color='green'>填写合格</font>";
return true;
}
}
//验证邮箱
function checkEmail(e_mail,returnStr){
var email = document.getElementById(e_mail).value;
var str = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;
if(!str.test(email)){
document.getElementById(returnStr).innerHTML="<font color='red'>邮箱格式不正确,格式如:xxx@xx.com</font>";
return false;
}else{
document.getElementById(returnStr).innerHTML="<font color='green'>填写合格</font>";
return true;
}
}
//表单验证
function formCheck(){
if(checkName() && checkPassword1() && checkPassword2() && checkAge() &&checkEmail()){
return true;
}else{
return true;
}
}
分享到:
相关推荐
"html、js简单表单验证"这个主题涉及到的是使用HTML5的内置验证机制以及JavaScript进行客户端的表单验证。下面将详细讲解这两个方面的知识。 首先,HTML5提供了一些内置的表单验证属性,比如`required`、`pattern`...
原生JavaScript表单验证插件是用于确保用户输入数据有效性和安全性的工具,它无需依赖任何外部库如jQuery,而是直接利用浏览器内置的API来实现。下面将详细解释这个主题。 原生JavaScript表单验证插件的核心在于...
总的来说,JavaScript表单验证是一种关键的前端技术,能够有效地防止无效数据的提交,提高用户满意度。通过熟练掌握这些基本技巧,你可以创建出更加健壮和友好的表单交互。在实际项目中,还可以结合AJAX异步提交,使...
JavaScript表单验证的核心在于事件监听和验证函数。常见的表单事件有`submit`(提交)、`change`(改变)、`focus`(获取焦点)和`blur`(失去焦点)。开发者通常会在`submit`事件上添加验证逻辑,以在用户尝试提交...
js表单验证实例,HTML文件,javascript常用表单验证: 账号、密码、身份证等
javascript很好很强大的JS表单验证 javascript很好很强大的JS表单验证
网上常见的用JS编写的注册表单验证的代码,非常实用哦
在本实验中,我们探讨了如何使用JavaScript进行简单的表单验证,确保用户输入的有效性。 HTML页面由一系列元素组成,形成一棵文档树。`<script>`标签用于将JavaScript代码嵌入到HTML文档中。在JavaScript中,可以...
以上都是简单的JavaScript表单验证实例,它们可以单独使用,也可以结合到更复杂的表单验证系统中。在实际开发中,通常会使用更高级的库如jQuery或现代框架如React、Vue等,结合表单验证库(如Formik、Vuelidate等)...
本资源集合了全网最全面的JavaScript表单验证方法,覆盖了从基础到高级的各种验证场景。 首先,让我们详细探讨一下`js表单验证`。JavaScript是一种在客户端运行的脚本语言,它可以在用户填写表单时实时检查输入,...
本文将深入探讨"javascript表单验证方式一",介绍如何利用JavaScript进行表单验证,确保用户输入的数据符合预设规则,提高用户体验,同时也减轻了服务器端的压力。 首先,表单验证的基本目标是检查用户在HTML表单中...
JavaScript表单验证是提高网页交互性和数据质量的关键步骤。通过学习和实践上述方法,你可以创建出更安全、更友好的表单。但要注意,前端验证不能完全替代后端验证,因为恶意用户可能绕过前端限制,所以后端验证同样...
比较实用的javascript做的表单验证,验证的表单域包括用户名、密码、密码...表单域基本通过获得焦点显示提示信息,失去焦点进行验证,还有提交表单验证。提交表单先进行必填项不能为空验证,再进行正则表达式匹配验证。
js表单验证 表单的验证一直是网页设计者头痛的问题,表单验证类 Validator就是为解决这个问题而写的,旨在使设计者从纷繁复杂的表单验证中解放出来,把精力集中于网页的设计和功能上的改进上。 Validator是基于...
在表单验证中,JavaScript可以通过监听表单的`submit`事件来阻止默认提交行为,然后逐个检查输入字段的值。可以使用`document.getElementById`或`document.querySelector`等方法获取表单元素,再利用`value`属性获取...
JavaScript(简称JS)是网页开发中用于实现客户端交互和数据验证的重要工具。在网页表单设计中,实时动态验证能够极大地提升用户体验,因为它允许用户在输入时立即得到反馈,了解其填写的信息是否符合要求,无需等待...
传统的验证方式往往需要编写大量的JavaScript代码,而这套框架通过提供配置文件和特定的标签使用,使得表单验证变得更加简单易行。 在使用**JS客户端表单验证框架**时,开发者不再需要手动编写复杂的JavaScript函数...
在JavaScript(JS)前端开发中,表单验证是不可或缺的一部分,它确保用户输入的数据符合预设的规则,从而提高用户体验并减少服务器端的处理压力。本文将深入探讨JS前端表单验证的相关知识点。 首先,我们要了解表单...
"JavaScript常见问题整理.txt"、"表单验证大全.txt"、"JavaScript表单验证控制代码大全.txt"、"JavaScript验证表单函数大全.txt"这些文件将提供更具体的信息和示例代码,帮助深入理解和掌握这一主题。