php 表单提交表单前端验证

最新推荐文章于 2021-03-15 11:08:28 发布

烬_zhang

最新推荐文章于 2021-03-15 11:08:28 发布

阅读量2.5k

点赞数

分类专栏： PHP JS 文章标签： php 表单提交表单前端验证

本文链接：https://blog.csdn.net/qq_37506868/article/details/77795625

版权

PHP 同时被 2 个专栏收录

16 篇文章 0 订阅

订阅专栏

5 篇文章 0 订阅

订阅专栏

//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框的方法,我上面的博客中也有,本人水平有限，

 但对于初学者还是有些帮助的。