php 表单提交 表单前端验证

来源:互联网 发布:ubuntu expect spawn 编辑:程序博客网 时间:2024/05/23 16:17
//HTML 代码
        <form id="form">            <input type="hidden" name="status" value="<?php echo $_GET['status'] ?>" />            <input type="hidden" name="url" />            <input type="hidden" name="vehicle_type" value="0" />            <input type="hidden" name="figure" value="0" />            <div class="bar"><label>司机名</label>                <div><input type="text" name="driver">                    <div class="layer"></div>                </div>            </div>            <div class="bar">                <?php if ((!empty($_GET['status']) && $_GET['status'] == 1) || (!empty($_GET['status']) && $_GET['status'] == 2)) { ?>                    <label class="pcode_name" id='name'>手机号</label>                    <div><input type="text" name="phone" id="pcode" class='br'>                        <div class="layer"></div>                    </div>                <?php } else { ?>                    <label class="code_name">邀请码</label>                    <div><input type="text" name="phone" id="code" class='br'>                        <div class="layer"></div>                    </div>                <?php } ?>            </div>        </form>    </div>    <div class="submit">        <a href="javascript:void(0)" id="submit">确认</a>    </div>
//js代码
   <script type='text/javascript'>
   
$('#submit').click(function() {           
if ($('#name').val() == '')           {               alert('请填写司机名称');               return false;           }
<?php if ((!empty($_GET['status']) && $_GET['status'] == 1) || (!empty($_GET['status']) && $_GET['status'] == 2)) { ?> if ($('#pcode').val() == '') { alert('请填' + ($(
'#pcode'
').text())); return false; } var phone = document.getElementById('pcode').value; if (!(/^1\d{10}$/.test(phone))) { alert("手机号码有误,请重填"); return false; } <?php } else { ?> if ($('#code').val() == '') { alert('请填' + ($('.code_name').text())); return false; } <?php } ?> $.post("/usercar/upload/", $("#form").serialize(), function(data) { if (data.status == 200) { alert(data.msg); document.location = '/site/icar/'; } else { alert(data.msg); } }, "json"); });

    </script>
方法2.
<script type='text/javascript'>   $('#submit').click(function() {           
    if ($('[name=driver]').val() == '') {                alert('请填写司机名称');                return false;            }
if ($('[name=phone]').val() == '') { alert('请填' + (($('.br').text()));
                return false;            }            var phone = document.getElementById('pcode').value;            if (!(/^1\d{10}$/.test(phone))) {                alert("手机号码有误,请重填");                return false;            }        $.post("/usercar/upload/", $("#form").serialize(), function(data) {            if (data.status == 200) {                alert(data.msg);                document.location = '/site/icar/';            } else {                alert(data.msg);            }        }, "json");    });    </script>

注:此处代码不是怎么好,但意思是表达了的,两种方法其实是两种获取input框的方式,对于获取input框的方法,我上面的博客中也有,本人水平有限,
 但对于初学者还是有些帮助的。

原创粉丝点击