Оповещение jQuery Tools срабатывает один раз (но только один раз)

Я пытаюсь создать простой механизм предупреждений с помощью jQuery Tools - в ответ на небольшой фрагмент кода Javascript всплывающее окно с сообщением и кнопкой OK, при нажатии которой наложение исчезает. Тривиально, по крайней мере, так и должно быть. Я рабски следил за http://flowplayer.org/tools/demos/overlay/trigger.html, и у вас есть кое-что, что работает нормально при первом вызове, но только в этот раз. Если я повторю действие JS, которое должно открыть наложение, этого не произойдет.

Мой контент / DIV:

<div class='modal' id='the_alert'>
  <div id='modal_content' class='modal_content'>
    <h2>hi there</h2>
    this is the body
    <p>
    <button class='close'>OK</button>
    </p>
  </div>
  <div id='modal_background' class='modal_background'><img src='/images/overlay/f9f9f9-180.png' class='stretch' alt='' /></div>
</div>

и Javascript:

function showOverlayDialog() {
$('#the_alert').overlay({
    mask: {color: '#cccccc', loadSpeed: 200, opacity: 0.9}, 
    closeOnClick: false,
    load: true 
});
}

Как я уже сказал: когда showOverlayDialog () вызывается в первый раз, наложение появляется точно так же, как и должно, и исчезает при нажатии кнопки «ОК». Но если я снова запустил showOverlayDialog () без перезагрузки страницы, ничего не произойдет. Если я перезагружаю страницу, шаблон повторяется - первый вызов вызывает оверлей, а второй - нет.

Я явно что-то упускаю - какие-нибудь советы? Спасибо!


person Jim Miller    schedule 31.12.2010    source источник
comment
Что вы прикрепляете к своей Close кнопке? На первый взгляд кажется, что вы можете манипулировать HTML, чтобы скрыть оверлей, а не использовать JQuery - следовательно, JQuery считает, что оверлей уже открыт, и не будет повторно отображать его. Это может быть неправильный анализ, но если вы разместите полный источник, возможно, мы сможем вам помочь.   -  person Basic    schedule 31.12.2010
comment
Я ничего не прикрепляю к кнопке «Закрыть». Мое (ограниченное) понимание jQuery Tools заключается в том, что назначение кнопки OK для class = close заставляет что-то автоматически происходить в коде jQuery Tools, что приводит к исчезновению наложения. В любом случае у меня нет других обработчиков jQuery или javascript, которые бы что-то делали со структурой.   -  person Jim Miller    schedule 31.12.2010


Ответы (1)


Определите диалог и установите load в false (отключение автозагрузки диалога):

$('#the_alert').overlay({
    mask: {
        color: '#cccccc',
        loadSpeed: 200,
        opacity: 0.9
    },
    closeOnClick: false,
    load: false
});

Затем в обработчике, отображающем диалоговое окно, вызовите load метод api:

$("#show").click(function() {
    $("#the_alert").data("overlay").load();
});

(Назначает событие щелчка элементу с идентификатором show, который показывает наложение)

Рабочий пример здесь: http://jsfiddle.net/andrewwhitaker/Vqqe6/

Я не верю, что вы можете определить более одного оверлея для определенного элемента, из-за которого возникла проблема.

person Andrew Whitaker    schedule 31.12.2010
comment
Понятно - большое спасибо! Мне пришлось немного подправить его, чтобы он соответствовал тому, что на самом деле происходит со страницей, но все в порядке. Звучит как ответ для меня; Благодарность! - person Jim Miller; 31.12.2010
comment
Спустя почти год этот ответ все еще кому-то пригодится. Спасибо, @Andrew. +1 - person rgin; 19.09.2011
comment
Мне пришлось установить истину для нагрузки - person Pablo S G Pacheco; 06.01.2014
comment
Ссылка на метод load api в ответе мертва - 404 Not Found | Извинения! | Мы не смогли найти то, что вы ищете. - person Pang; 23.06.2017