javascript - 是什么触发 HTML 表单提交?

标签 javascript jquery html forms

对于无法提供任何实际代码,我深表歉意,因为问题出现在当前私有(private)的页面中:-/请耐心等待。

我有一个 HTML 表单。我将一个(专有)日历小部件附加到其中一个文本输入字段。当用户跳入该字段时,日历就会出现。在日历上有几个按钮(移动到上个月/下个月)。当用户单击这些按钮之一时,日历会相应地自行更新,而且 - 表单会提交!除了日历本身和它所附加的文本输入字段之外,日历代码中没有任何内容,更不用说提交表单了!对于以下任何问题的任何线索,我将不胜感激:

1) 在这种情况下,什么可能会提交表单?

2) 除了点击提交按钮或按下回车键之外,通常提交表单的是什么? (特别是普通按钮会提交表单吗?在什么情况下?)

3) 作为一种解决方法,以防万一我无法解决这个问题,有没有一种方法可以简单地完全禁用提交表单(然后在附加到提交键的事件处理程序中重新启用它)?

注意:除此之外,日历的行为正常 - 正常响应关键事件并在日期本身(不是按钮)上单击事件。我在 Firefox 和 Chrome 上都试过这个并且得到了相同的行为。我试着用 FireBug 一步一步地跟踪点击事件处理程序,一切看起来都很正常——但是当它完成时,表单就被提交了(并且页面重新加载)。该小部件使用 jQuery 1.7.2。对理解和/或解决此问题的任何帮助将不胜感激!

最佳答案

很抱歉回答我自己的问题,但给出的答案都不完整,即使我从他们和评论中学到了东西!感谢所有参与的人!

所以:

1+2) 由 <button> 定义的按钮元素导致提交(就好像他们设置了 type="submit" 一样。至少在某些浏览器中是这样)。如果一个人想要一个按钮导致提交应该使用<button type="button"> ,或者旧的<input type="button" /> .

3) (现在对我来说没有必要,但这是问题的一部分。)有很多方法可以防止表单提交。其中三个是:

  • 处理 onsubmit事件,阻止提交(通过 return false; 或 - 最好! - 通过 e.preventDefault(); )以防未设置标志;在处理应该实际提交表单的事件时设置标志

  • 处理 onsubmit如果触发事件的元素不是我们想要导致提交的元素(之一),则阻止提交

  • 将表单 Action 设置为非 Action ,即action="#" ,并让应该实际提交表单的事件的处理程序将操作设置为正确的地址

关于javascript - 是什么触发 HTML 表单提交?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11893573/

相关文章:

javascript - Django表中数据更新

javascript - 根据设备打开链接

javascript - 在按钮单击同一行复选框时应选中

javascript - 如何让这个网格发挥作用

javascript - 添加后如何删除类

javascript - 展开/折叠摘录和内容

javascript - 从导航栏中删除一个类以使其在单击导航栏项目时折叠

javascript - 如何在日期选择器中添加预先选择的日期

html - 我的页面在浏览器中移动/重新定位! (但在 Coda 预览中看起来不错)

javascript - 如何将数据从 CSV 文件导入服务器端的 Meteor 集合