微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

表单 – 如何阻止iPad/iPhone上的Go按钮发布表单

我有一个使用iPad显示的动态表单。

此表单有几个单选按钮和一些文本字段和一个提交按钮。

在iPad中,虚拟键盘GO按钮应该用于输入密钥,导致点击表单中的第一个提交按钮和要发布的表单。

为了避免在表单完成之前过度的不自愿的贴子,我们在表单中添加一个额外的提交按钮,绝对位于可见区域之外,并带有onclick =“return false;”。
这个劫持进入击键防止意外发布在除Safari Mobile之外的每个浏览器。

在iPad上,我们甚至测试了Opera mobile,并且按预期的方式工作。

但是Safari Mobile显然忽略了返回false,因为事件点击按钮会导致没有其他浏览器发生的帖子,甚至没有PC上的Safari。

我的问题是

1:为什么safari手机忽略“返回虚假”提交,是否有其他机制在这里玩?

2:点击GO后如何停止Safari手机发布表单?

我在Google和Stackoverflow上进行了大量搜索,发现了很多例子,但都需要大量的JavaScript和事件绑定,并且窗体的动态特性以及用户生成内容使得这个错误很容易复杂,因为几乎所有要求的绑定事件文本框和文本区。

任何有效的解决方案都是好的,但是越简单越好,特别是如果不需要对表单或可能与自动完成或验证事件冲突的事件进行大量定制。

示例测试页:http://lab.dnet.nu/ipad.php

解决方法

我找到了解决我的问题的办法。

问题的基础是Safari手机忽略onsubmit =“返回false”按钮,它只适用于表单。

设置onsubmit =“return false;”在表单上,​​进行正常按钮(不提交)并设置onclick =“form.submit()”。

防爆。

<form method="post" onsubmit="return false;">
    ... //Other fields here

    <input type="button" value="Send" onclick="form.submit();" />
</form>

Go按钮不会触发正常按钮,只能提交按钮。
由于表单有onsubmit =“return false;”它不会发布。

另一方面,按钮触发onclick =“form.submit();”它覆盖了表单上的onsubmit。

这个解决方案似乎可以在任何浏览器中工作。

原文地址:https://www.jb51.cc/html/233602.html

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

相关推荐