jQuery Tools оповещение работает один раз (но только один раз) - PullRequest
13 голосов
/ 31 декабря 2010

Я пытаюсь создать простой механизм оповещения с помощью 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 () снова работать, не перезагружая страницу, ничего не произойдет.Если я перезагружаю страницу, то шаблон повторяется - первый вызов вызывает оверлей, но второй - нет.

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

1 Ответ

20 голосов
/ 31 декабря 2010

Определите диалог и установите для 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/

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

...