2016-06-23 2 views
1

Я хотел бы начать с того, что я искал и искал решение моей проблемы - и после того, как пробовал все, что я читал, не было успеха. Я просто хочу сделать простой модальный всплывающее окно, когда пользователь нажимает на ссылку (которая еще не готова).Модальный Исчезает Быстро + Бутстрап + Javascript

--- Уже Пробовал ---

  1. Сделано уверен, что не было второй начальной загрузки файла JavaScript (особенно в заголовке)
  2. Пробовал изменения в JavaScript синтаксиса
  3. Пробовал изменения в ссылке html

Когда я сделал ссылку «кнопка», модальность была прекрасной - но я не хочу, чтобы простая ссылка была кнопкой.

$("body").on("click","#empty",function(event){ 
    $("#myModal").modal() 
}) 
<li><a href="#" data-toggle="modal" data-target="#myModal" id="empty">Our Blog</a></li> 

Я также попытался

$(document).ready(function(){ 
    $("#empty").click(function(){ 
     $("#myModal").modal(); 
    }); 
}); 

Я подозреваю, что что-то не так в том, как HTML настроен (так как модальный работал на «кнопку», но привычка для регулярной связи)

Сообщите мне, если вам нужно больше пояснений - Спасибо за помощь!

ответ

0

Это работает модальный ... Это может быть полезно для вас ...

<script type='text/javascript'> 
('#myModal').modal('show'); 
</script> 

<li><a href="#" data-toggle="modal" data-target="#myModal">Click Here</a></li> 

<div id="myModal" class="modal fade" role="dialog"> 

<!-- Modal content--> 
<div class="modal-content"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal">&times;</button> 
    <h4 class="modal-title">Modal Header</h4> 
    </div> 
    <div class="modal-body"> 
    <p>Some text in the modal.</p> 
    </div> 
    <div class="modal-footer"> 
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
    </div> 
</div> 

иначе попробуйте этот код ...

$(document).ready(function(){ 
$("#empty").click(function(){ 
    $("#myModal").modal('show'); 
}); 
}); 
+0

Спасибо! Сначала я попробую. Если это сработает, тогда моя отметка должна быть где-то там. – whr2206

+0

у вас есть решение ... –

0

Если ваша ссылка «еще не готова», когда вы запускаете модальный Javascript, это не сработает. Предполагая, что ваша ссылка создана динамически, вы должны убедиться, что вы ее инициируете, когда она находится в DOM, в обратном вызове JS или, тем не менее, ваша ссылка создана (вместо функции Document.ready).

Также стоит отметить, что для начала по умолчанию запускающего (установка в HTML с «data-» атрибуты), вы просто использовать:

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

Но если вы хотите, чтобы вызвать его вручную в функции OnClick, вам нужно добавить «шоу» или «тумблер:

$("body").on("click","#empty",function(){ 
    $('#myModal').modal('toggle'); 
)}; 

Опять же, оба из этих кодов нуждается подведение в document.ready функции или обратный вызов, когда ваша ссылка в DOM.

+0

Спасибо за помощь! Я полный новичок, когда речь заходит об интерфейсе. – whr2206

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