一个表单的创建与验证

实例展示

样式

左边的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;
        }