“alert()”和“confirm()”不适用于“apple-mobile-web-app-capable”
Posted
技术标签:
【中文标题】“alert()”和“confirm()”不适用于“apple-mobile-web-app-capable”【英文标题】："alert()" and "confirm()" not working with "apple-mobile-web-app-capable" 【发布时间】：2013-09-19 19:40:36 【问题描述】：在 ios（当前为 7.0）下，当我们的 Web 应用程序被固定到主屏幕（也就是使用元标记 apple-mobile-web-app-capable）时，alert() 和 confirm() 似乎不起作用。
我发现一位用户在 twitter 上遇到了类似的问题：
https://twitter.com/thomasfuchs/status/380137801259704320
如果真的是 iOS 7 中的错误，任何人都有临时修复？
【问题讨论】：
【参考方案1】：我们遇到了类似的问题，即警报破坏了我们的网络应用程序。具体情况是从选择列表的 onchange 触发的警报。我们整理了一个非常简单的测试页面，如下所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
</head>
<body>
<select onchange="alert('broken!');">
<option value="one">One</option>
<option value="two">Two</option>
</select>
</body>
</html>
在 iPad 中从 Safari 运行该页面并更改选择列表会触发警报，然后 Safari 会冻结。您实际上必须关闭 Safari。这通常会影响 Safari - 您的 Web 应用程序不必固定在主屏幕上。您应该可以在运行 iOS 7 的 iPad 上在此测试页面 http://jsbin.com/AGoTejA/1 上进行测试。
我们已经在 iPad 2 (MC774B/A) 和 iPad 3 (MD367B/A) 上对此进行了测试，但 Safari 在两者上都崩溃了。
解决此问题的一种巧妙方法是使用 setTimeout() 来延迟警报的执行。只有当 Safari 尝试同时显示选择列表项和警报时，才会出现此问题。 confirm() 也以同样的方式被破坏。
【讨论】：
我通过使用 Alertify 解决了这个问题。简单，有效。 fabien-d.github.io/alertify.js/0.4.0rc1 这确实是一个很棒的示例块。您是否已将此情况报告给radar.apple.com？【参考方案2】：自 iOS 7.0.3 起，javascript alert() 和 confirm() 错误已修复。
【讨论】：
我在 iOS 7.0.4 上，这个错误仍然发生在我身上。 confirm() 在 iPhone 4S 上的 iOS 7.0.4 上适用于我，但在早期的 iOS 上不起作用（不确定我之前使用的是哪个 7.0.x）。也许这个错误只发生在 iPad 上。【参考方案3】：我不知道这是设计使然还是错误，但我可以确认这是一个真正的问题。要注意的另一件事是，如果用户可以选择保存密码，则任何需要登录的站点都将失败，因为该提示也被阻止。 （您可以使用带有用户名和密码框的简单表单来尝试此操作，仅此而已，它根本不会提交）。尽管所有三个问题都有解决方法。
登录 - 在站点的表单标签中设置 autocomplete="off"，或检测站点正在运行 IOS7 并处于全屏模式并应用此设置
$('form').attr('autocomplete', 'off');
警报和确认 - 您可以使用 JavaScript 编写自定义函数，也可以以与此处大致相同的方式覆盖现有函数：http://andrewensley.com/2012/07/override-alert-with-jquery-ui-dialog/。我喜欢使用 Eric Martin 的 SimpleModal 插件，它有一个内置的 Confirm override，http://www.ericmmartin.com/projects/simplemodal-demos/ 的底部演示。
我希望其中的一些帮助。
【讨论】：
【参考方案4】：我用 setTimeout 解决了
<select onchange="setTimeout(function()alert('not broken!');,200)">
<option value="one">One</option>
<option value="two">Two</option>
</select>
http://jsbin.com/iPuXiVA/4/
无论如何，这个错误似乎困扰的是 iPad 而不是 iPhone。
【讨论】：
可以确认iphone 6受到影响【参考方案5】：我使用以下代码遇到了这种情况：
const confirmation = window.confirm(message || 'Are you sure?');
确认将显示在 PC（Edge 浏览器）上，但不会显示在 iPhone（Safari 浏览器）上
我将代码更改为以下内容（删除了窗口。）：
const confirmation = confirm(message || 'Are you sure?');
然后它突然又开始工作了。
我猜 Apple 有自己的 confirm 实现，它不需要 窗口。
【讨论】：
【参考方案6】：我认为与平滑隐藏选择框动画有关的错误。 我不喜欢黑客，但这种方法有效。 在 100 毫秒后调用确认（这对于选择窗口关闭之前的时间足够了）
var object;
$('form select').change(function()
object = $(this);
timer = setTimeout(confirmation, 100);
);
function confirmation()
switch(object.val())
case 'post_approved':
case 'post_delete':
case 'thread_delete': object.parent('form').find('input[name=id]').val(object.parent('form').find('input[name=post_id]').val()); break;
case 'user_delete_all': object.parent('form').find('input[name=id]').val(object.parent('form').find('input[name=user_id]').val()); break;
default: return false; break;
if(object.parent('form').find('input[name=act]').val() === 'post_approved' || (object.parent('form').find('input[name=act]').val() != '' && confirm('Вы уверены?')))
object.parent('form').submit();
else
return false;
【讨论】：
【参考方案7】：安徒生是正确的：
从 iOS7.0.3 开始修复的 JavaScript alert() 和 confirm() 错误
刚刚自己安装并测试过。
在 Apple 解决此问题时，我争先恐后地寻找解决方法，最终找到了一个名为 Alertify 的 js 插件，我认为这值得分享。我想我会从现在开始使用它，不管错误修复如何！它只是让警报、提示等看起来非常非常好。认为值得分享，因为这篇文章的读者可能会使用标准的浏览器警报。我很兴奋地偶然发现它。
【讨论】：
我正在使用 iPad mini 和 iOS 7.0.3，但问题仍然存在于 Safari 中。不过，它适用于 Chrome。 我还可以确认它不适用于 IOS 7.0.3 的两种不同类型的 ipad以上是关于“alert()”和“confirm()”不适用于“apple-mobile-web-app-capable”的主要内容，如果未能解决你的问题，请参考以下文章