Инструменты наложения Jquery вызывают функцию JavaScript - PullRequest
Новая
       7

Инструменты наложения Jquery вызывают функцию JavaScript

2 голосов
/ 12 июня 2010

У меня есть окно наложения jquery в моем html вместе с кнопкой для активации, здесь код. 

<!-- Validation Overlay Box -->
<div class="modal" id="yesno" style="top: 100px; left: 320px; position: relative; display: none; z-index: 0; margin-top: 100px;">
    <h2>  &nbsp;&nbsp;Authentication Failed</h2>

    <p style="font-family:Arial; font-size:small; text-align:center">
       Ether your username or password has been entered incorrectly.
       Please make sure that your username or password entered correctly...
    </p>

    <!-- yes/no buttons -->
    <p align="center">
        <button class="close"> OK </button>
    </p>
</div>

Вот скрипт Jquery tools 

<SCRIPT>
$(document).ready(function() {
    var triggers = $(".modalInput").overlay({
        // some mask tweaks suitable for modal dialogs
        mask: {
            color: '#a2a2a2',
            loadSpeed: 200,
            opacity: 0.9
        },
        closeOnClick: false
    });

    var buttons = $("#yesno button").click(function(e) {
        // get user input
        var yes = buttons.index(this) === 0;

        // do something with the answer
        triggers.eq(0).html("You clicked " + (yes ? "yes" : "no"));
    });

    $("#prompt form").submit(function(e) {
        // close the overlay
        triggers.eq(1).overlay().close();

        // get user input
        var input = $("input", this).val();

        // do something with the answer
        triggers.eq(1).html(input);

        // do not submit the form
        return e.preventDefault();
    });

});
</SCRIPT>

А вот как это вызывается при нажатии на кнопку или гиперссылку 

"<BUTTON class="modalInput" rel="#yesno">You clicked no</BUTTON>"

Все, что я хочу, - я не хочу показывать наложение при нажатии на кнопку или по ссылке. Можно ли вызвать его через функцию JavaScript, например "showOverlay ()" ??

1 Ответ

2 голосов
/ 12 июня 2010

У вас есть 2 варианта, есть вариант load , который вы можете использовать, например: 

var triggers = $(".modalInput").overlay({
 mask: {
  color: '#a2a2a2',
  loadSpeed: 200,
  opacity: 0.9
 },
 closeOnClick: false,
 load: true
});

Это открывает его немедленно, вы можете увидеть APIдемо здесь .Если вы хотите просто показать наложение в какой-то момент спустя после его настройки, просто запустите событие, к которому оно привязано, click, например: 

$(".modalInput").click();

Это запускает то же поведение обработчика, что и нажатие кнопки или ссылки, открывая оверлей.

...