一个完整的表单代码，使用hide()和show()来控制错误提示的内容

　　这是一个学员报名的表单，CSS部分：

<style>
.XY_Wrap input{margin:0;padding:0;border:none;outline:none;display:block}
.XY_Wrap{width:100%;overflow:hidden;margin-top:30px}
.XY_Wrap .XY_Title{width:100%;height:30px;text-align:center;font:16px/30px microsoft yahei;color:#f00}
.XY_Wrap .XY_Section{width:100%;height:60px;margin-top:20px;overflow:hidden;display:flex;justify-content:space-between}
.XY_Wrap .XY_SectionInformation{width:19%;padding-right:1%;height:60px;overflow:hidden;text-align:right;font:18px/38px microsoft yahei}
.XY_SectionInformation>i{color:#f00;padding-right:5px;font:normal 16px/38px microsoft yahei}
.XY_Wrap .XY_SectionMain{width:80%;height:60px;overflow:hidden;font:18px/40px microsoft yahei}
.XY_Wrap .XY_SectionInput{width:100%;height:40px}
.XY_Wrap .XY_SectionText{width:90%;padding-left:1%;height:38px;font:16px/38px microsoft yahei;border:1px solid #ddd}
.XY_Wrap .XY_SectionRadio{display:inline-block}
.XY_Wrap label{display:inline-block;margin-right:50px}
.XY_Wrap .XY_SectionError{font:12px/20px microsoft yahei;color:#f00}
.XY_Wrap .XY_Submit{width:100%;height:40px;margin-top:20px}
.XY_Wrap .XY_Submit>input{width:150px;height:40px;background:#666;color:#fff;cursor:pointer;margin:0 auto;text-align:center;font:16px/40px microsoft yahei;-webkit-appearance:none}
</style>

　　HTML部分：

<script  src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script>
<div class="XY_Wrap">
<form id="FormInfo" name="FormInfo" action="xybm.php" enctype="multipart/form-data" method="post">
    <div class="XY_Title">请认真填写以下信息，24小时内只能提交一次！</div>
    <div class="XY_Section">
        <div class="XY_SectionInformation"><i>&#42;</i>学员姓名：</div>
        <div class="XY_SectionMain">
            <div class="XY_SectionInput"><input class="XY_SectionText" name="xyxm" type="text" placeholder="请输入你的姓名..." autocomplete="off"/></div>
            <div class="XY_SectionError"><span class="Err Err_xyxm1" style="display:none">姓名不能为空！</span></div>
        </div>
    </div>
    <div class="XY_Section">
        <div class="XY_SectionInformation"><i>&#42;</i>学员性别：</div>
        <div class="XY_SectionMain">
            <div class="XY_SectionInput"><input class="XY_SectionRadio" id="man" name="xyxb" type="radio"  value="男性" checked=""/><label for="man">男性</label><input class="XY_SectionRadio" id="woman" name="xyxb" type="radio"  value="女性"/><label for="woman">女性</label></div>
            <div class="XY_SectionError"><span class="Err Err_xyxb1" style="display:none">请选择性别！</span></div>
        </div>
    </div>
    <div class="XY_Section">
        <div class="XY_SectionInformation"><i>&#42;</i>身份证号：</div>
        <div class="XY_SectionMain">
            <div class="XY_SectionInput"><input class="XY_SectionText" name="sfzh" type="text" placeholder="请输入你的身份证号..." autocomplete="off"/></div>
            <div class="XY_SectionError"><span class="Err Err_sfzh1" style="display:none">身份证号不能为空！</span><span class="Err Err_sfzh2" style="display:none">身份证号格式不正确！</span></div>
        </div>
    </div>
    <div class="XY_Section">
        <div class="XY_SectionInformation"><i>&#42;</i>手机号码：</div>
        <div class="XY_SectionMain">
            <div class="XY_SectionInput"><input class="XY_SectionText" name="sjhm" type="text" placeholder="请输入手机号码..." autocomplete="off"/></div>
            <div class="XY_SectionError"><span class="Err Err_sjhm1" style="display:none">手机号码不能为空！</span><span class="Err Err_sjhm2" style="display:none">手机号码错误！</span></div>
        </div>
    </div>
    <div class="XY_Section">
        <div class="XY_SectionInformation">联系地址：</div>
        <div class="XY_SectionMain">
            <div class="XY_SectionInput"><input class="XY_SectionText" name="lxdz" type="text" placeholder="请输入联系地址..." autocomplete="off"/></div>
            <div class="XY_SectionError"><span class="Err Err_lxdz" style="display:none">联系地址不能为空！</span></div>
        </div>
    </div>
    <div class="XY_Section">
        <div class="XY_SectionInformation">所在行业：</div>
        <div class="XY_SectionMain">
            <div class="XY_SectionInput"><input class="XY_SectionText" name="szhy" type="text" placeholder="请输入你所在行业..." autocomplete="off"/></div>
            <div class="XY_SectionError"><span class="Err Err_szhy" style="display:none">行业不能为空！</span></div>
        </div>
    </div>
    <div class="XY_Section">
        <div class="XY_SectionInformation">担任职务：</div>
        <div class="XY_SectionMain">
            <div class="XY_SectionInput"><input class="XY_SectionText" name="drzw" type="text" placeholder="请输入你的职务..." autocomplete="off"/></div>
            <div class="XY_SectionError"><span class="Err Err_drzw" style="display:none">职务不能为空！</span></div>
        </div>
    </div>
    <div class="XY_Submit">
        <input type="submit" name="FormInfoSubmit" value="提交信息" onclick="return Infocheck()"/>
    </div>
</form>
</div>

　　JS部分：

<script>
function Infocheck(){
    $(".Err").hide();
    var tijiao=true;
    if(FormInfo.xyxm.value==""){
        $(".Err_xyxm1").show();
        tijiao=false;
    }
    if(FormInfo.sfzh.value==""){
        $(".Err_sfzh1").show();
        tijiao=false;
    }else if(!(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(FormInfo.sfzh.value))){
        $(".Err_sfzh2").show();
        tijiao=false;
    }
    if(FormInfo.sjhm.value==""){
        $(".Err_sjhm1").show();
        tijiao=false;
    }else if(!(/^1[34578]\d{9}$/.test(FormInfo.sjhm.value))){
        $(".Err_sjhm2").show();
        tijiao=false;
    }
    if(tijiao==false){
    return false;
    }else{
    FormInfo.FormInfoSubmit();
    }
}
</script>

　　需要引用jquery，代码可能有点啰嗦，先留做备份。