提交表单的4种方式_java自定义表单

提交表单的4种方式_java自定义表单通用提交按钮–>2、提交3、说明:用户提交按钮或图像按钮时,就会提交表单。使用或都可以定义提交按钮,只要将其特性的值设置为“submit”即可,而图像按钮则是通过的type特性值设置为”image”来定义的。因此,只要我们单击一下代码生成的按钮,就可以提交表单。4、阻止表单提交只要在表单中存在上面列出的任何一种按钮,那么相应表单控件拥有焦点的情况下,按回车键就可以提交表单。如果表单里没有提…


Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

通用提交按钮–>

2、

提交

3、

说明:用户提交按钮或图像按钮时,就会提交表单。使用或都可以定义提交按钮,只要将其特性的值设置为“submit”即可,而图像按钮则是通过的type特性值设置为”image”来定义的。因此,只要我们单击一下代码生成的按钮,就可以提交表单。

4、阻止表单提交

只要在表单中存在上面列出的任何一种按钮,那么相应表单控件拥有焦点的情况下,按回车键就可以提交表单。如果表单里没有提交按钮,按回车键不会提交表单。

以这种方式提交表单时,浏览器会在将请求发送给服务器之前触发submit事件。这样,我们就有机会验证表单数据,并据以决定是否允许表单提交。阻止这个事件的默认行为就可以取消表单提交。例如,下面代码会阻止表单提交:

var EventUtil = {

addHandler: function (element, type, handler) {

if (element.addEventListener) {

element.addEventListener(type, handler, false);

} else if (element.attachEvent) {

element.attachEvent(“on” + type, handler);

} else {

element[“on” + type] = handler;

}

},

getEvent: function (event) {

return event ? event : window.event;

},

preventDefault: function (event) {

if (event.preventDefault) {

event.preventDefault();

} else {

event.returnValue = false;

}

}

};

var form = document.getElementById(“myForm”);

EventUtil.addHandler(form, “submit”, function () {

//取得事件对象

event = EventUtil.getEvent(event);

//阻止默认事件

EventUtil.preventDefault(event);

});

调用preventDefault()方法阻止了表单提交。一般来说,在表单数据无效而不能发送给服务器时,可以使用这一技术。

5、在JavaScript中,以编程方式调用submit()方法也可以提交表单。这种方式无需表单包含提交按钮,任何时候都可以正常提交表单。来看一个例子:

var form = document.getElementById(“myForm”);

//提交表单

form.submit();

在以调用submit()方法的形式提交表单时,不会触发submit事件,因此要记得在调用此方法之前先验证表单数字据。

提交表单时可能出现的最大问题,就是重复提交表单。在第一次提交表单后,如果长时间没有反映,用户可能会变得不耐烦。这时候,他们也许会反复单击提交按钮。结果往往很麻烦(因为服务器要处理重复请求),或者造成错误(如果是下了订单,那么可能会多定好几份)。

解决这一问题的办法有两个:

在第一次提交表单后就禁用提交按钮;     利用onsubmit事件处理程序取消后续的表单提交操作。

posted on 2012-06-06 10:16 japper 阅读(10728) 评论(7)  编辑  收藏 所属分类: Java

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/188224.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长

相关推荐

  • 将ipynb转化为pdf_jupyter打开ipynb文件

    将ipynb转化为pdf_jupyter打开ipynb文件将ipynb文件转换为markdownjupyternotebook文件(扩展:ipynb)转换说明转换jupyternotebook文件(扩展:ipynb)使用jupyternotebook转为为markdown文档文件。转换说明执行命名进行转化;文件名有空格推荐:“LinerR.ipynb”方式;LinerR.ipynb种诺是有图片,会自动保存至当前LinerR_f…

    2022年8月29日
  • 安卓apk证书_安卓无法打开apk文件

    安卓apk证书_安卓无法打开apk文件获取apk证书文件MD5值

    2022年4月20日
  • 查看文件句柄数 linux_linux文件句柄数量怎么看

    查看文件句柄数 linux_linux文件句柄数量怎么看查看系统的最大文件句柄数和文件句柄的使用者PIDulimit-n查看当前系统的最大句柄数显示如下ulimit-HSnx设置当前系统的文件句柄数为x以上命令中,H指定了硬性大小,S指定了软性大小,n表示设定单个进程最大的打开文件句柄数量。个人觉得最好不要超过4096,毕竟打开的文件句柄数越多响应时间肯定会越慢。设定句柄数量后,系统重启后,又会恢复默认值。如果想永久保存下来,可以修…

    2022年10月17日
  • 吐血总结!50道Python面试题集锦(附答案)「建议收藏」

    吐血总结!50道Python面试题集锦(附答案)「建议收藏」Python是目前编程领域最受欢迎的语言。在本文中,我将总结Python面试中最常见的50个问题。每道题都提供参考答案,希望能够帮助你在2019年求职面试中脱颖而出,找到一份高薪工作。这些面试题涉及Python基础知识、Python编程、数据分析以及Python函数库等多个方面。Q1、Python中的列表和元组有什么区别?Q2、Python的主要功能是什么?Python是一种解释型…

    2022年6月10日
  • 两周搞定计算机专业毕业设计,附源码+论文+答辩

    两周搞定计算机专业毕业设计,附源码+论文+答辩毕设+论文+答辩通关法则,看这一篇,源码都在下面了!写在前面,尽管论文方法和毕设源码都有,但还是要看课+自己敲完完善好。做好充分准备面对答辩。文章目录一、毕设二、论文2.1论文标题2.2确定论文大纲2.3论文内容2.3.1文科找文献:2.3.2论文摘要2.3.3绪论2.3.4论文内容2.4论文查重三、答辩3.1论文答辩前的准备3.2论文答辩现场对弈一、毕设毕设直通车《黑马智慧物业毕业设计》【毕设项目】01网上购物商城(前端+后端+云部署)【毕设项目】02网上购物商城(前端

    2022年7月26日
  • LTE-FDD和TDD帧结构「建议收藏」

    LTE-FDD和TDD帧结构「建议收藏」1.两种双工模式LTE支持两种双工模式:TDD和FDD,于是LTE定义了两种帧结构:TDD帧结构和FDD帧结构。LTE标准制定之初就充分考虑了TDD和FDD双工方式在实现中的异同,增大两者共同点、减少两者差异点。两种帧结构设计的差别,会导致系统实现方面的不同,但主要的不同集中在物理层(PHY)的实现上,而在媒介接入控制层(MAC)、无线链路控制(RLC)层的差别不大,在更高层的设计上几乎没…

    2022年6月10日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号