1

所以我正在解决我们应用程序中的一个问题，但无法解决。我还没有编写基本代码，只能注入 CSS 和 Javascript。有一个非常基本的带有 ID 的 span 元素，下面是一段 Javascript 代码片段，基本上是说“如果点击了带有 ID submitButton 的元素，则提交表单#createForm”。但是，在移动设备上它已损坏并且浏览器没有给出任何错误。

<form method="post" action="page.html" id="createForm">
    <span id="submitButton">Submit form</span>
</form>
<script> 
    $("#submitButton").on("click", function (event) {
        if (attributeEqualsDisabled($(this).attr('disabled'))) {
            return true;
        }
        $("#submitButton").attr('disabled', true);
        $('#createForm').submit();
    });
</script>

现在，即使在使用 Chrome 的“显示为 iphone”模式时，它也可以在桌面浏览器上完美运行。您可以单击按钮，一切正常。

但是，在移动 Safari 上以及将页面添加为 web 应用程序时，该按钮不再起作用。当您按下它时，页面只是滚动到顶部并且什么都不做。我已经通过我的 Mac 进行了检查，一切看起来都很正常，与桌面上的完全一样。我什至可以$("#submitButton").click();通过控制台在我的 iphone 上运行，它运行良好。

控制台中没有错误或警告。有没有人有任何解决此问题的建议？遗憾的是，我无法直接访问代码，因为一切都在 IP 锁定的服务器上。

有什么方法可以准确查看单击按钮时会发生什么？我已经尝试过“时间轴”选项卡，但是当我按下按钮时它什么也没有显示。

4

1 回答 1

0

另一个用户的这个答案修复了它：https ://stackoverflow.com/a/3026621/3461722

感谢 Robin Zigmond 为我指明了正确的方向。我在想是什么东西阻止了点击事件的触发，但它根本没有注意到它，因为我需要跟踪touchstart事件。

链接的答案确实提到通过cursor:pointer;使用 CSS 添加到按钮中找到了更好的解决方案，但是我的元素已经有了它，所以它显然在这种情况下不起作用。

添加此功能以检测手机上的点击：

$('#submitButton').bind( "touchstart", function(e){
    if (attributeEqualsDisabled($(this).attr('disabled'))) {
        return true;
    }
    $("#submitButton").attr('disabled', true);
    $('#createForm').submit();
});
于 2018-10-03T15:31:06.347 回答