2016-11-01 5 views
1

Я следую учебному пособию по созданию простого модального кода, но в инструкциях объясняется, как открыть его с помощью кнопки внутри HTML-кода, который ее вызывает.Открытый внешний вид HTML

<html> 
<head> 
</style> 
    <!-- Don't forget to include jQuery ;) --> 
    <script src="jquery.modal.js" type="text/javascript" charset="utf-8"></script> 
</head> 
<body> 

    <!-- Modal HTML embedded directly into document --> 
    <div id="ex1" style="display:none;"> 
    <p>Thanks for clicking. That felt good. <a href="#" rel="modal:close">Close</a> or press ESC</p> 
    </div> 

    <!-- I WANT TO ACTIVATE THIS ACTION FROM A JAVASCRIPT FILE --> 
    <p><a href="#ex1" rel="modal:open">Open Modal</a></p> 

</body> 
</html> 

Если бы я хотел открыть его из связанного файла js, как я мог это сделать?

+0

[jquery modal documentation] (http://jquerymodal.com/) есть все ответы, которые вы можете съесть –

ответ

1

Универсальное решение

Для простоты присвоить идентификатор этого события:

<a id="testID" href="#ex1" rel="modal:open">Open Modal</a> 

Тогда просто вызвать щелчок на этом элементе.

JQuery:

$("#testID").click(); 

JQuery-режимное конкретное решение

Просто позвоните это, чтобы открыть модальное:

$("#testID").modal(); 

И закрыть программно присвоить идентификатор "testClose" к некоторому элементу внутри модального модуля и запустите его, чтобы закрыть модальный:

$("#testClose").modal({closeExisting: true}); 

Возможных улучшения для более тонкого контроля

Я заметил, что jquery-modal использует пользовательские события, такие как «modal:open», так что теоретически вы могли бы также назвать это:

$("#testID").trigger("modal:before-block"); 
$("#testID").trigger("modal:block"); 
$("#testID").trigger("modal:before-open"); 
$("#testID").trigger("modal:open"); 

Однако это один сделал не работает для меня. Просто используйте .click().

Смежные вопросы