自定义输入框的校验规格

有时候没有用校验组件,需要自己定义class,对输入框进项限制

//必填项校验 
function validateInputRequirement(){
	var flag = true;
	$(".input_requirement").each(function(index, element){
		var content = $(this).val();
		if(content.trim().length == 0){
			flag = false;
			return false;
		}
	});
	return flag;
}

//验证文本型的输入:文本内容校验
function validateTextInput(){
	var flag = true;
	$(".text_input_reg").each(function(index, element){
		if($(this).val().length == 0){
			return true;
		}
		if(!/^[\u0391-\uFFE5\w]+$/.test($(this).val())){
			flag = false;
			return false;
		}
	});
	return flag;
}
//校验电话号码
function validatePhoneInput(){
	var flag = true;
	$(".phone_input_reg").each(function(index, element){
		if(!/^(1[3,5,7,8]{1}[\d]{9})$/.test($(this).val())){
			flag = false;
			return false;
		}
	});
	return flag;
}

//校验座机
function validateTelInput(){
	var flag = true;
	$(".tel_input_reg").each(function(index, element){
		 var value = $(this).val();
		 if(!/^(1[3,5,7,8]{1}[\d]{9})$/.test(value) && !/^(((0\d{2,3})|400|800)-)?(\d{7,8})(-(\d{3,}))?$/.test(value)){
			 flag = false;
			 return false;
		 }
	});
	return flag;
}

//校验身份证号码
function validateIdentityInput(){
	var flag = true;
	$(".identity_input_reg").each(function(index, element){
		var content = $(this).val();
		if(!isIdCardNo(content)){
			flag = false;
			return false;
		}
	});
	return flag;
}

function isIdCardNo(num) {
    var factorArr = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2, 1);
    var parityBit = new Array("1", "0", "X", "9", "8", "7", "6", "5", "4", "3", "2");
    var varArray = new Array();
    var lngProduct = 0;
    var intCheckDigit;
    var intStrLen = num.length;
    var idNumber = num;
    // initialize
    if ((intStrLen != 15) && (intStrLen != 18)) {
        return false;
    }
    // check and set value
    for (var i = 0; i < intStrLen; i++) {
        varArray[i] = idNumber.charAt(i);
        if ((varArray[i] < '0' || varArray[i] > '9') && (i != 17)) {
            return false;
        } else if (i < 17) {
            varArray[i] = varArray[i] * factorArr[i];
        }
    }
    if (intStrLen == 18) {
        //check date
        var date8 = idNumber.substring(6, 14);
        if (isDate8(date8) == false) {
            return false;
        }
        // calculate the sum of the products
        for (i = 0; i < 17; i++) {
            lngProduct = lngProduct + varArray[i];
        }
        // calculate the check digit
        intCheckDigit = parityBit[lngProduct % 11];
        // check last digit
        if (varArray[17] != intCheckDigit) {
            return false;
        }
    }
    else {//length is 15
        //check date
        var date6 = idNumber.substring(6, 12);
        if (isDate6(date6) == false) {
            return false;
        }
    }
    return true;
}

function isDate6(sDate) {
    if (!/^[0-9]{6}$/.test(sDate)) {
        return false;
    }
    var year, month;
    year = sDate.substring(0, 4);
    month = sDate.substring(4, 6);
    if (year < 1700 || year > 2500) return false;
    if (month < 1 || month > 12) return false;
    return true;
}

function isDate8(sDate) {
    if (!/^[0-9]{8}$/.test(sDate)) {
        return false;
    }
    var year, month, day;
    year = sDate.substring(0, 4);
    month = sDate.substring(4, 6);
    day = sDate.substring(6, 8);
    var iaMonthDays = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
    if (year < 1700 || year > 2500) return false;
    if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) iaMonthDays[1] = 29;
    if (month < 1 || month > 12) return false;
    if (day < 1 || day > iaMonthDays[month - 1]) return false;
    return true;
}


品牌表 (brand) 字段名 类型 说明 id INT(11) 品牌 ID(主键) brand_nam e VARCHAR(50) 品牌名称(唯一索引) sort_orde r INT(11) 排序值(越大越优先) is_visibl e TINYINT(1) 是否显示(0:隐藏 1:显示) updated_a t DATETIME 更新时间 2. 商品标签表 (product_tag) 字段名 类型 说明 id INT(11) 标签 ID(主键) tag_name VARCHAR(50) 标签名称(唯一索引) tag_descriptio n VARCHAR(255) 标签说明(允许为空) sort_order INT(11) 排序值(越大越优先) is_visible TINYINT(1) 是否显示(0:隐藏 1:显示) updated_at DATETIME 更新时间 3. 规格模板表 (spec_template) 字段名 类型 说明 id INT(11) 模板 ID(主键) template_nam e VARCHAR(50) 模板名称(唯一索引) sort_order INT(11) 排序值(越大越优先) is_visible TINYINT(1) 是否显示(0:隐藏 1:显示) updated_at DATETIME 更新时间 4. 规格明细表 (spec_detail) 字段名 类型 说明 id INT(11) 规格 ID(主键) template_i d INT(11) 关联 spec_template.id(外键) spec_name VARCHAR(50) 规格名称(如"颜色","尺码") spec_value s TEXT 规格值(逗号分隔,如"红,蓝") sort_order INT(11) 排序值(越大越优先) 任务 1:品牌管理模块(35 分) 功能要求(对应【品牌管理.png】和【编辑品牌.png】) 1. 品牌列表展示 使用 Element UI 表格展示数据 列顺序:ID、品牌名称、排序值、是否显示、更新时间、操作列 操作列包含"编辑"和"删除"按钮(使用 Element UI 图标) 2. 添加/编辑品牌弹窗 实现【编辑品牌.png】的表单布局 字段:品牌名称(输入框)、排序值(数字输入框)、是否显示(开关组件) 弹窗标题动态显示:"添加品牌" 或 "编辑品牌" 3. 删除品牌功能 实现【删除品牌.png】的确认对话框 使用 Element UI 的 MessageBox 确认框 验证要求: 品牌名称:必填、唯一性校验(实时检查重复) 排序值:数字类型、范围 0-100 删除时需二次确认 共 页 第 页 任务 2:标签管理模块(40 分) 功能要求(对应【商品标签.png】和【编辑标签.png】) 1. 标签搜索功能 顶部搜索框(Element UI Input 组件) 支持按标签名称模糊查询 实时刷新表格数据 2. 标签表格展示 列顺序:序号、标签名称、标签说明、排序值、是否显示、更新时间、操作列 标签说明为空时显示"-" 3. 添加/编辑标签弹窗 实现【编辑标签.png】的表单布局 字段:标签名称(输入框)、标签说明(文本框)、排序值(数字输入框)、是否显示(开 关) 验证要求: 标签名称:必填、长度 2-20 字符 排序值:自动填充默认值 10 标签说明:最多 255 字符 任务 3:数据交互实现(25 分) 功能要求 1. 品牌 API 对接 GET /api/brands 获取品牌列表 POST /api/brands 创建品牌 PUT /api/brands/{id} 更新品牌 DELETE /api/brands/{id} 删除品牌 2. 标签 API 对接 GET /api/tags?name=关键词 搜索标签 POST /api/tags 创建标签 3. 实时验证 品牌名称唯一性校验(使用 axios 异步请求) 表单提交前验证(Element UI 表单验证) 布局要求: 共 页 第 页 实现方式 1:使用若依低代码平台:配置表单生成器 实现方式 2:自定义开发:使用 Element UI 的 Form 组件 注意:可使用任何工具,任何架构,功能实现基本一致,界面基本一致。 提交:效果截图,关键代码截图,前端代码压缩文件,后端代码压缩文件。
最新发布
06-12
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值