.load JQuery не работает в Chrome

Question

Я работаю над проектом и продолжаю работать над этой конкретной проблемой, которая .load не будет работать в Google Chrome. Вот JavaScript:

    function link1() {
     $('#loadarea').html('loading.....');
      setTimeout('link1_go()', 850);
    }
    function link1_go() {
      $('#loadarea').load("regular.html");
      $('#loadarea').hide().fadeIn('slow');
    }

И вот кликабельный div для вызова действия:

<div id="link1" class="clickableload" onclick="link1()">

И есть контейнер для загрузки:

<div id="loadarea"></div>

Работает Firefox и т. Д., Но не в Chrome. Любые предложения, ребята?

Answer 1

Попробуйте изменить setTimeout звонок. Когда вы используете строковый параметр для setTimeout, это вызывает функцию браузера eval, которая может не выполнять то, что вы ожидаете, особенно если link1_go не является глобальной функцией. Сделайте это вместо:

setTimeout(link1_go, 850);

Answer 2

В последнее время я очень осторожен, когда дело доходит до «последовательности событий».Когда бы ни было возможно, я удостоверяюсь, что операторы загружаются только в той последовательности, которую я хочу.У меня не было проблем в Chrome, который является моим основным отладочным веб-браузером.

Для показанного случая я бы предложил следующее исправление:

function link1() {
    $('#loadarea').html( function () {
        setTimeout('link1_go()', 850);
        return '<p>loading.....</p>';
    })
}

function link1_go() {
    $('#loadarea').fadeOut().load("regular.html").fadeIn('slow');
}

Since the "loadarea" is already displaying "loading ... "; a fadeout and a fadein would be more elegant then hide() and fadeIn.

Furthermore, for the present request, I would get away with link1_go completely:

function link1() {
    $('#loadarea').html( function () {
        setTimeout("$('#loadarea').fadeOut().load('regular.html').fadeIn('slow')", 850);
        return '<p>loading.....</p>';
    })
}