form表单提交的几种方法

方法一：利用form的onsubmit()函数

</pre><pre code_snippet_id="1952561" snippet_file_name="blog_20161027_1_4846833" name="code" class="html">Html代码  <span style="font-size:24px;"><script type="text/javascript">      function validateForm(){      if(document.reply.title.value == ""){ //通过form名来获取form          alert("please input the title!");          document.reply.title.focus();          return false;      }         if(document.forms[0].cont.value == ""){ //通过forms数组获取form          alert("please input the content!");          document.reply.cont.focus();          return false;      }      return true;    }  <form name="reply"  method="post" onsubmit="return validateForm( );">          <input type="text" name="title"  size="80" /><br />          <textarea name="cont" cols="80" rows="12"></textarea><br />          <input type="submit" value="提交" >  </form>  注意：  1.onsubmit属性内容一定要有return关键字，否则函数会直接执行，不会返回  2.validateForm一定要返回一个boolean类型的返回值  3.提交按钮要写成submit类型的  </span></span>

第一种的第二种

</pre><pre code_snippet_id="1952561" snippet_file_name="blog_20161027_1_4846833" name="code" class="html"><form id="qwe" method="post" name="myform"   action="user"><span style="white-space:pre"></span><h2>登录</h2><p class="tyg-p">欢迎访问  客户关系管理系统</p><span style="white-space:pre"></span><div style="margin:5px 0px;"><span style="white-space:pre"></span><input id="inname" type="text" placeholder="请输入账号..."/>                <p id="pname" name="pname" style="display:none; color:#ff3300;font-size: 16px;">请输入管理员名称</p><span style="white-space:pre"></span></div><span style="white-space:pre"></span><div style="margin:5px 0px;"><span style="white-space:pre"></span><input id="inpwoods" type="text" placeholder="请输入密码..."/>                 <p id="pwoods" name="pname" style="display:none; color:#ff3300;font-size: 16px;">请输入密码并且大于八位数！</p><span style="white-space:pre"></span></div><span style="white-space:pre"></span><div style="margin:5px 0px;"><span style="white-space:pre"></span><input id="inyan"  type="text" style="width:150px;" placeholder="请输入验证码..."/><span style="white-space:pre"></span><img src="./img/1.png" style="vertical-align:bottom;" alt="验证码"/>                <p id="pyan" name="pname" style="display:none; color:#ff3300;font-size: 16px;">请输入正确的验证码！</p><span style="white-space:pre"></span></div><span style="white-space:pre"></span><button type="submit" onclick="return yanzheng()" >登<span style="width:10px;"></span>入</button>                 </form>

</pre><pre code_snippet_id="1952561" snippet_file_name="blog_20161027_1_4846833" name="code" class="html"><pre code_snippet_id="1952561" snippet_file_name="blog_20161027_1_4846833" name="code" class="html"><button type="submit" onclick="return yanzheng()" >登<span style="width:10px;"></span>入</button>

 onclick="return yanzheng()" 这样 也可以   把这个写在from 也可以

方法二：利用input类型为submit组件的onclick()函数

</pre><pre code_snippet_id="1952561" snippet_file_name="blog_20161027_1_4846833" name="code" class="html">  <span style="font-size:24px;">  1.将上面form标签中的onsubmit="return validateForm()"属性，去掉。    2.为“提交”按钮添加onclick事件，如下：     <input type="submit" value="提交" onclick="return validateForm();"></span>

方法三：利用button组件的onclick()函数，手动提交

<span style="font-size:24px;"><script type="text/javascript">      function modifyItem() {          if (trim(document.getElementById("itemName").value) == "") {              alert("物料名称不能为空！");              document.getElementById("itemName").focus();              return;          }           with (document.getElementById("itemForm")) {              method = "post";              action = "item.do?command=modify&pageNo=${itemForm.pageNo}";              submit();          }      }      //返回      function goBack() {          window.self.location = "item.do?command=list&pageNo=${itemForm.pageNo}";      }  </script>  <form name="itemForm" id="itemForm">        <input name="itemNo" type="text"   id="itemNo" value="${ item.itemNo }" >        <input name="itemName" type="text"   id="itemName" value="${ item.itemName }" >       <input name="btnModify"  type="button" id="btnModify" value=“修改" onclick="modifyItem()">  </form>  注意：  1.提交时，设置form的action和methods属性，然后利用form.submit()函数提交。   总结：1.对form中的组件验证时，前两个使用的是name属性，包括form自身的。2.如果提交表单时没有反应，同时确定提交表单部分代码没有问题，请查看提交表单前面的js代码，有时前面js的错误会引发莫名其妙的问题。</span>

<span style="font-size:24px;"></span>

</pre><h3>方法四：struts方法提交</h3><pre code_snippet_id="1952561" snippet_file_name="blog_20161027_3_1717697" name="code" class="html">

</pre><pre name="code" class="java"><span style="font-size:24px;">1.基于Struts标签，submit类型提交：<html:form action="/login"method属性可以忽略不写，原因是Struts默认method="post"2.基于非Struts标签，submit类型提交：<from action="/Test/login.do?method="login"" method="post"非Struts标签时，method属性默认为get,为方便，一般设置为post3.非Struts标签，button类型提交：<from action="/Test/login.do?method=login" method="post"<input type="button" name="login" onclick="login()"/<javaScript type="test/javaScript"function login(){document.forms[0].action=document.forms[0].act</span>

</pre><pre code_snippet_id="1952561" snippet_file_name="blog_20161027_6_9875315" name="code" class="html">

方法五：

</pre><pre name="code" class="javascript"><span style="font-size:24px;">1.当输入用户名和密码为空的时候，需要判断。这时候就用到了校验用户名和密码，这个需要在jsp的前端页面写；有两种方法，一种是用submit提交。一种是用button提交。方法一：在jsp的前端页面的头部插入一个js方法： function checkUser(){   var result = document.getElementById("userid").value;   var password = document.getElementById("userpassid").value;   if(result == ""  ){     alert("用户名不能为空");     return false;   }   if(password == ""  ){    alert("密码不能为空");     return false;   }else{   return true;   }}在form表单里写成这样：<form id="formid"  name= "myform" method = 'post'  action = 'user_login_submit.action' onsubmit = "return checkUser();" >            <table width="100%" border="0">              <tr>                <td width="60" height="40" align="right">用户名 </td>                <td><input type="text" value="" class="text2" name = "username" id = "userid"/></td>              </tr>              <tr>                <td width="60" height="40" align="right">密  码 </td>                <td><input type="password" value="" class="text2" name = "userpass" id = "userpassid"/></td>              </tr>              <tr>                <td width="60" height="40" align="right"> </td>                <td><div class="c4">                    <input type="submit" value="" class="btn2"  /> 方法二：function checkUser(){   var result = document.getElementById("userid").value;   var password = document.getElementById("passid").value;   if(result == ""  ){     alert("用户名不能为空");     return false;   }   if(password == ""  ){    alert("密码不能为空");     return false;   }  document.getElementById("formid").submit();}form表格的写法，需要写id <form id="formid" method = 'post'  action = 'user_login_submit.action'  >button按钮的写法如下：<input type="button" value="" class="btn2" onclick = "checkUser();" /></span>