一个表单的创建与验证

实例展示

样式

左边的span(设置宽度,display:inline-block,text-align:right)就可以右对齐了

js
页面的html布局
<li>
    <span class="textinfo">联系电话</span>
    <input type="" name="" value="" id="contentmobile" maxlength="11">
   <label for="" id="" class="contentmobile"></label>
</li>		    
正则校验电话的方法
function checkMobile(str) {
	var reg = /^(0|86|17951)?(13[0-9]|15[012356789]|17[0135678]|18[0-9]|14[57])[0-9]{8}$/;
	if(str.match(reg)){
		return true;
	} else{
		return false;
	}
}

页面中调用的方法
  //申请的按钮
	   $('.btn').click(function(){
	   		checkDatas();
	   });
		// 检查数据完整性
		function checkDatas(type) {
			// 检查手机号
			var contactTel = $('#contentmobile').val().trim();
			var flag = true;
			if (contactTel == '' || contactTel == null || contactTel == undefined) {
				$('.contentmobile').html('手机号不能为空');
				flag = false;
				return flag;
			}

			if (!checkMobile(contactTel)) {
				$('.contentmobile').html('请输入正确的手机格式');
				flag = false;
				return flag;
			}
			return flag;
		}
原文地址:https://www.cnblogs.com/lml-lml/p/7978472.html