onclick 事件在 iPhone 上不起作用
Posted
技术标签:
【中文标题】onclick 事件在 iPhone 上不起作用【英文标题】：onclick event doesn't work on iphone 【发布时间】：2017-10-11 06:54:16 【问题描述】：我有应该上传图片的表格。每个表单都放在 iframe 中
<body style="margin: 0; padding: 0; height: 100%; cursor: pointer;" onclick="document.querySelector('.register-upload-input').click()">
<form method="POST" action="http://127.0.0.1:8000/de/client/registerupload" accept-charset="UTF-8" enctype="multipart/form-data">
<input class="register-upload-input" style="display: none;" onchange="document.querySelector(".preloader").style.display="block";document.querySelector("form").submit();" accept=".jpg,.jpeg,.png" name="image" type="file">
</form>
</body
所以我点击 iframe，文件上传对话框出现，我可以选择图像。 body 元素有 onclick 事件。
一切正常，但是当我尝试使用 iphone 上传图像时，没有任何反应，对话框提示不会出现。它适用于android，但不适用于iphone。我做了研究，通常会发生这样的问题，因为元素的样式应该有cursor: pointer。我添加了它，但没有任何改变
【问题讨论】：
【参考方案1】：不要在<input>上设置display:none，你可以改为设置height:0px。
编辑：
我查看了我的笔记，发现***上也有同样的问题。
同样的问题是here。
三个原因导致了这个问题：
在javascript中，去掉return false；事件监听器。
在样式表中，调用动作的元素必须具有属性 光标：指针；。可能苹果在这些电话中提出了这个要求 以获得有关用户界面的最佳反馈。
再次在样式表中，我们不能 设置显示：无；用于隐藏输入，因为某些浏览器没有 接受对未显示元素的点击。
【讨论】：
【参考方案2】：将以下 CSS 添加到 IFrame 内容中。
html, body
touch-action: auto;
【讨论】：
谢谢回复，我加了这个样式，还是不行以上是关于onclick 事件在 iPhone 上不起作用的主要内容，如果未能解决你的问题，请参考以下文章
带有 Bootstrap 的按钮 OnClick 事件在 iOS 上不起作用
jquery click 在 ipad/iphone 上不起作用