<div class="cooper_left">
    <h4>合作申请</h4>
    <ul>
        <li><input type="text" name="name" value="" placeholder="您的姓名">
            <p>*请输入姓名</p>
        </li>
        <li><input type="text" name="mobile" value="" placeholder="您的电话">
            <p>*请输入正确电话号码</p>
        </li>

        <li><input type="text" name="schoolname" value="" placeholder="幼儿园名称">
            <p>*请输入幼儿园名称</p>
        </li>
        <li>
            <select name="duties">
                <option value="0" class="option_default">您的职务</option>
                <option value="1" >园长</option>
                <option value="2">教研主任</option>
                <option value="3">老师</option>
            </select>
            <p>*请选择您的职务</p>
        </li>
        <li><a href="javascirpt:void(0);">提交申请</a><p class="succ_tips">*恭喜您,提交成功</p></li>
    </ul> 
</div>

<script>
    $(function () {
        $('.single-item').slick({dots: false,arrows:false});
        $('.multiple-items').slick({infinite: true,autoplay:true,arrows:false,slidesToShow: 3,slidesToScroll: 3});
// 验证
function check_form(tname,tmobile,tschool,tduties){
    var $name = $(".cooper_left input[name=name]"),
    $mobile = $(".cooper_left input[name=mobile]"),
    $school = $(".cooper_left input[name=schoolname]"),
    $duties = $(".cooper_left select[name=duties]");
    var regname = /^[A-Za-z0-9_\-\u4e00-\u9fa5]+$/;
    if(!regname.test(tname)){
        $name.siblings('p').show();
        return false;
    }else{
        $name.siblings('p').hide();
    }
    var regmob = /[0-9-()()]{7,18}/;                    
    if(!regmob.test(tmobile)){
        $mobile.siblings('p').show();
        return false;
    }else{
        $mobile.siblings('p').hide();
    }
    var regschool = /^[A-Za-z0-9_()()\-\u4e00-\u9fa5]+$/;
    if(!regschool.test(tschool)){
        $school.siblings('p').show();
        return false;
    }else{
        $school.siblings('p').hide();
    }
    if(tduties === '0'){
        $duties.siblings('p').show();
        return false;
    }else{
        $duties.siblings('p').hide();
    }
    return true;
}
$(document).on("click",".cooper_left a",function(){
    var tname = $.trim($(".cooper_left input[name=name]").val()),
    tmobile = $.trim($(".cooper_left input[name=mobile]").val()),
    tschool = $.trim($(".cooper_left input[name=schoolname]").val()),
    tduties = $.trim($(".cooper_left select[name=duties]").val());
    if (!check_form(tname,tmobile,tschool,tduties)) {
        return false;
    }
    console.log("success");
    $.ajax({
        url: '/path/to/file',
        type: 'GET',
        dataType: 'json',
        data: {
            "name":tname,
            "mobile":tmobile,
            "school":tschool,
            "duties":tduties
        },
        success:function(data){
            if (data && data.status === 200) {
                $(".succ_tips").show();
            }
        }
    })
    .done(function() {
        console.log("success");
    })
    .fail(function() {
        console.log("error");
    })
    .always(function() {
        console.log("complete");
    });

});
})
</script>
版权声明:本文为李维亮博主的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:http://www.liweiliang.com/600.html

标签: 表单验证

评论已关闭