文章目录

form表单提交前验证实现方法

form表单提交是网站中最常见的,基本上所有的网站都会用到。

除非你就一些静态网页,仅仅是展示,而不需要互动,所以不需要提交表单。

但是在提交表单的时候,难免会出现一些意想不到的错误。

比如说数据库里面的name字段,明明是不允许为空,但是在提交表单的时候,没有填写,却提交了。

要如何才能避免这种情况发生呢?

这时我们就需要在表单提交前进行验证了。

看看下面的代码。

html代码<form name="form1" id="form1" method="post">
  <div>
     <p>
     姓名:<input type="text" name="name" id="name" />
     </p>
     <p>
     年龄:<input type="text" name="age" id="age" />
     </p>
     <p>
     <input type="submit" name="okbtn" id="okbtn" value="提交" />
     </p>
  </div>
  </form>
  <script>
  $("#okbtn").click(function(){
  var name=$.trim($("#name").val());
  var age=$.trim($("#age").val());
  if (name==''){
  alert("请填写姓名");
  return false;
  }
  if (age==''){
  alert("请填写年龄");
  return false;
  }
  });
  </script>
亲自测试一下

上面的代码,我们用的jquery。

当点击提交按钮的时候,在其click事件中,判断填写字段是否为空,如果为空,则return false,就不会进行提交了。

同理,对其他表单字段进行验证也是同样的方法。

本文网址:http://www.santii.com/article/161.html


数据更新时间:2018-09-21