很多时候诸如留言板之类我们都需要设置必填项，在用户触发提交按钮的时候做一次判断，今天道成设计就跟大家分享一段表单字段必填项的JS代码。

在html5里有个针对input等设置的required="required" 代码，但是这个代码有的浏览器不兼容，在这个浏览器良莠不齐的今天，最好的办法还是用JS，毕竟最原始的IE6都支持的东西，基本没几个浏览器不支持了。
先直接将代码贴出来：

----------------------------------------------------------------------


<section class="wrapper">
<section class="wrap">
   <hgroup class="titbar">
      <h2>在线下单</h2>
      <h4>我们将第一时间与您取得联系</h4>
   </hgroup>
   <section class="order-form">
<form action="" enctype="multipart/form-data" method="post"  name="order_form"  onSubmit="return checkForm()">
      <!-- 说明：
       required="required": 必须填写 -->
      <dl>
         <dt>货物名称</dt>
         <dd><input class="ipt" type='text' name='huowumingcheng' id='huowumingcheng' required="required"></dd>
         <dd class="impt">*</dd>
      </dl>
      <dl>
         <dt>目的地</dt>
         <dd><input class="ipt" type="text"name='mudidi' id='mudidi'  required="required"></dd>
         <dd class="impt">*</dd>
      </dl>
      <dl>
         <dt>重量(KG)</dt>
         <dd><input class="ipt" type="text" name='zhongliang' id='zhongliang' required="required"></dd>
         <dd class="impt">*</dd>
      </dl>
      <dl>
         <dt>体积(m&sup3;)</dt>
         <dd><input class="ipt" type="text"  name='tiji' id='tiji'  required="required"></dd>
         <dd class="impt">*</dd>
      </dl>
      <dl>
         <dt>发货人</dt>
         <dd><input class="ipt" type="text" name='fahuoren' id='fahuoren'  required="required"></dd>
         <dd class="impt">*</dd>
      </dl>
      <dl>
         <dt>电话</dt>
         <dd><input class="ipt" name='dianhua' id='dianhua'  required="required"></dd>
         <dd class="impt">*</dd>
      </dl>
      <dl>
         <dt></dt><!-- 不要删除 -->
         <dd class="tips">所有信息均需填写</dd>
      </dl>
      <dl>
         <dt></dt><!-- 不要删除 -->
         <dd><input class="btn" type="submit" name="submit" value=" 确定下单"></dd>
         <dd class="impt"></dd><!-- 不要删除 -->
      </dl>
      </form>
   </section>
</section>
</section>
 
<script>
function checkForm(){
   var huowumingcheng=document.getElementById('huowumingcheng').value
   var mudidi=document.getElementById('mudidi').value
   var zhongliang=document.getElementById('zhongliang').value
   var tiji=document.getElementById('tiji').value
   var fahuoren=document.getElementById('fahuoren').value
   var dianhua=document.getElementById('dianhua').value
   if(huowumingcheng=='' || mudidi=='' || zhongliang=='' || tiji=='' || fahuoren=='' || dianhua==''){
      alert("所有信息均需填写");
      return false;
   }
   return true
}
</script>

---------------------------------------------------------

主要是一个form的onSubmit="return checkForm()" 值，以及input设置ID于 javascript里的ID对应，然后alert输出弹窗提示文本