setTimeout не работает на Safari Mobile

Question

У меня есть функция, которая показывает меню при нажатии на него, и я хочу, чтобы оно исчезло через 5 секунд. Это мой javascript - он работает правильно в настольном браузере, но не исчезает в мобильных.

$(function() {
    $('#prod_btn').click(function() {
        $(this).addClass('selected').next('ul').css('display', 'block');
        setTimeout(hideMenu, 5000);
    });
});

function hideMenu() {
    $('#prod_btn').removeClass('selected').next('ul').css('display', 'none');
}

В чем проблема?

Спасибо

Answer 1

У меня просто была такая же проблема. Мой код отлично работает в любом браузере на моем Mac, но на устройствах iOs он не работает.

Я использую ".bind(this)" в своей функции тайм-аута, и именно это вызывает у меня проблему. Когда я расширяю объект функции с помощью ".bind" в моем скрипте, он работает как шарм.

Мой код примерно такой:

searchTimeout = setTimeout(function() {
...
}.bind(this),250);

Чтобы это работало на устройствах iOs, я (как упомянуто выше) просто добавил это:

Function.prototype.bind = function(parent) {
    var f = this;
    var args = [];

    for (var a = 1; a < arguments.length; a++) {
        args[args.length] = arguments[a];
    }

    var temp = function() {
        return f.apply(parent, args);
    }

    return(temp);
}

Я не вижу никаких.bind на вашем setTimeout, но для других с такой же проблемой это может быть проблемой. Вот почему я выкладываю:-)

Answer 2

Это не относится к вашему коду, но распространенная проблема с сбоями долгоиграющих сценариев на устройствах iOS состоит в том, что MobileSafari уничтожает поток javascript по истечении 10 секунд. вы должны быть в состоянии использовать setTimeout и / или setInterval, чтобы обойти это, или вы можете избежать этого, сделав ярлык к нему и тем самым запустив его как приложение. см. https://discussions.apple.com/thread/2298038, особенно комментарии Дейна Харриган.

Answer 3

Я переместил ваш пример на jsbin, и он работает на моем iphone 4.

Пожалуйста, проверьте это здесь с ваших устройств: http://jsbin.com/asihac/5

Вы можете увидеть код здесь http://jsbin.com/asihac/5/edit

В примере используется jQuery - последний, и я только добавил необходимый класс CSS.

Answer 4

Имейте также в виду, что любая функция setTimeout фактически срабатывает, когда элементы DOM рендерится, если для задержки задано слишком короткое значение. Хотя это может показаться очевидным, его можно легко перепутать с отсутствием какого-либо метода стрельбы. Хороший способ проверить это запустить предупреждение.

window.onLoad(alert("hey!"));

Затем проверьте, сработает ли ваша функция после.