可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

Under iOS (currently 7.0), it looks like alert() and confirm() are not working when our web app is pinned to the home screen (aka using the meta tag apple-mobile-web-app-capable).

I found a user having a similar issue on twitter:

https://twitter.com/thomasfuchs/status/380137801259704320

Anybody has a temporary fix if it's really a bug in iOS 7?

回答1:

The JavaScript alert() and confirm() bugs are fixed as of iOS 7.0.3.

回答2:

We had a similar issue with alerts breaking our web app. The specific case was an alert which was triggered from the onchange of a select list. We put together a very simple test page like this:

<!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>

Running that page from Safari in an iPad and changing the select list triggers the alert then Safari freezes. You actually have to then close Safari. This affects Safari in general - your web app doesn't have to be pinned to the home screen. You should be able to test this on an iPad running iOS 7 on this test page http://jsbin.com/AGoTejA/1.

We have tested this on an iPad 2 (MC774B/A) and an iPad 3 (MD367B/A) and Safari crashes on both.

A hacky way to get around this is to use a setTimeout() to delay execution of the alert. The problem only seems to happen when Safari is trying to display the overlay which shows the select list items and an alert at the same time. confirm() is also broken in the same way.

回答3:

I don't know if it is by design or a bug but I can confirm this is a real problem. One other thing to be aware of is that if the user has the option to save passwords enabled, any site that requires a login will fail because that prompt is also blocked. (you can try this with a simple form with a username and password box and nothing else and it simply won't submit). There are workarounds though for all three issues.

Login - set autocomplete="off" in the form tag for the site, or detect that the site is running IOS7 and in fullscreen mode and apply this setting
```
$('form').attr('autocomplete', 'off');
```
Alerts and Confirms - you can either write a custom function in JavaScript or override the existing functions in much the same way as here: http://andrewensley.com/2012/07/override-alert-with-jquery-ui-dialog/. I like using Eric Martin's SimpleModal plugin which has a built in Confirm override, the bottom demo on http://www.ericmmartin.com/projects/simplemodal-demos/.

I hope some of that helps.

回答4:

I solved with a 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/

Anyway, seems this bug afflicts the iPad and not the iPhone.

回答5:

I think that a bug related to the smooth hiding selection boxes animation. I do not like hacks, but this method works. Confirming called after 100 ms (this is enough for the time until the selection window closes)

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;
}

回答6:

Andersen is correct:

javascript alert() and confirm() bugs fixed as of iOS7.0.3

just installed and tested it myself.

While Apple was fixing the issue, I scrambled to find something to work around it, and ended up finding a js plugin called Alertify that I thought this was worthwhile to share. I think I'll use it from now on, regardless of the bug fix! It just makes alerts, prompts etc look really, really good. Thought it was worth sharing since readers of this post are likely using the standard browser alerts. I was stoked to stumble across it.