您当前的位置:首页 > 网站建设 > javascript
| php | asp | css | H5 | javascript | Mysql | Dreamweaver | Delphi | 网站维护 | 帝国cms | React | 考试系统 | ajax |

HTML form表单提交方法案例详解

51自学网 2022-05-02 21:34:01
  javascript

form表单提交方式总结一下:

一、利用submit按钮实现提交,当点击submit按钮时,触发onclick事件,由JavaScript里函数判断输入内容是否为空,如果为空,返回false, 不提交,如果不为空,提交到由action指定的地址。

<script type="text/javascript">         function check(form) {              if(form.userId.value=='') {                    alert("请输入用户帐号!");                    form.userId.focus();                    return false;               }               if(form.password.value==''){                    alert("请输入登录密码!");                    form.password.focus();                    return false;                 }                 return true;         }</script><form action="login.do?act=login" method="post">    用户帐号<input type=text name="userId" size="18" value="" ><br>    登录密码<input type="password" name="password" size="19" value=""/>                 <input type=submit name="submit1" value="登陆" onclick="return check(this.form)">  </form>

二、利用button按钮实现提交,当点击button按钮时,触发onclick事件,由JavaScript里函数判断输入内容是否为空,如果为空,返回false, 不提交,如果不为空,提交到由action指定的地址,由于button按钮不具备自动提交的功能,所以由JavaScript实现提交。

<script type="text/javascript">         function check(form) {              if(form.userId.value=='') {                    alert("请输入用户帐号!");                    form.userId.focus();                    return false;               }               if(form.password.value==''){                    alert("请输入登录密码!");                    form.password.focus();                    return false;                }                  document.myform.submit();            }    </script><form action="login.do?act=login" name="myform" method="post">    用户帐号<input type=text name="userId" size="18" value="" ><br>    登录密码<input type="password" name="password" size="19" value=""/>          <input type=button name="submit1" value="登陆" onclick="check(this.form)">  </form>

三、利用submit按钮实现提交,当点击submit按钮时,先触发onsubmit事件,由JavaScript里函数判断输入内容是否为空,如果为空,返回false, 不提交,如果不为空,提交到由action指定的地址。

<script type="text/javascript">         function check(form) {              if(form.userId.value=='') {                    alert("请输入用户帐号!");                    form.userId.focus();                    return false;               }               if(form.password.value==''){                    alert("请输入登录密码!");                    form.password.focus();                    return false;                }                return true;         }</script><form action="login.do?act=login" method="post" onsubmit="return check(this)">    用户帐号<input type=text name="userId" size="18" value="" ><br>    登录密码<input type="password" name="password" size="19" value=""/>          <input type=submit name="submit1" value="登陆"> </form> 

以上就是form表单常用的三种提交方式,有不明白的地方,欢迎qq交流:317856821

到此这篇关于HTML form表单提交方法案例详解的文章就介绍到这了,更多相关HTML form表单提交内容请搜索wanshiok.com以前的文章或继续浏览下面的相关文章希望大家以后多多支持wanshiok.com!


react分页显示数据的方法
JavaScript 鼠标事件(MouseEvent)案例讲解
51自学网,即我要自学网,自学EXCEL、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。
京ICP备13026421号-1