SimpleModal - закрытие iframe с кнопкой закрытия

Question

Итак, я искал вокруг, и я не мог найти окончательного ответа. Я хочу, чтобы в моем iframe была кнопка закрытия, чтобы пользователи могли щелкнуть ее, а не идти с помощью клавиши ESC, чтобы закрыть контейнер SimpleModal.

Я пробовал несколько вещей, но похоже, что в iframe ничего не передается, чтобы закрыть контейнер.

Answer 1

попробовать это:

$(document).keyup(function (e) { 
     if (e.keyCode == 27) { 
      return; 
     } 
    }); 

Answer 2

Попробуйте следующее:

parent.$.modal.close(); 

source

Answer 3

У меня была та же проблема. Это произошло, когда атрибут src iFrame использовал протокол https в качестве протокола. В этом случае parent.$.modal.close(); не будет работать.

Что я сделал, чтобы исправить это, добавьте обычную кнопку закрытия, о которой говорит Эрик на странице проекта SimpleModal.

Добавьте строку closeHTML к вашему модальному сценарию:

closeHTML:"<a href='#' class='modalCloseImg' alt='Close' title='Close'><a>", 

Это добавит кнопку закрытия на вне модальных, а не внутри IFRAME.

Затем вам нужно стилизовать кнопку закрытия, используя этот CSS на странице:

<style type="text/css"> 
#simplemodal-container a.modalCloseImg { 
    background:url('http://your.domain.name/your_image_folder/x.png') no-repeat; /* adjust url as required */ 
    width:25px; 
    height:29px; 
    display:inline; 
    z-index:3200; 
    position:absolute; 
    top:-15px; 
    right:-18px; 
    cursor:pointer; 
} 
</style> 

Вы можете найти изображение здесь: SimpleModal Demo's x.png

Вот полный скрипт для вас:

<script type="text/javascript"> 
// Display an external page using an iframe 
var src = "http://your.domain.name/your_source_file.html"; 
$.modal('<iframe src="' + src + '" height="450" width="830" style="border:0">', { 
    closeHTML:"<a href='#' class='modalCloseImg' alt='Close' title='Close'><a>", /* Add this <a> tag for the Close image to appear. */ 
    containerCss:{ 
     backgroundColor:"#fff", 
     borderColor:"#fff", 
     height:450, 
     padding:0, 
     width:830 
    }, 
    overlayClose:false /* Stops user from clicking overlay to exit modal. */ 
}); 
</script> 

Надеюсь, это поможет! Приветствия Пол

Answer 4

Я решить эту проблему простым способом, но я использовал ссылку <a> вместо кнопки, но это то же самое.

Просто просто положить это: класс = «SimpleModal-близко» Например, если вы хотите кнопку, чтобы закрыть: <input type="submit" class="simplemodal-close" value="Close" />

Попробуйте его, ни функций, ни OnClick = «», нет ничего. Он работает

Предполагая, что вы используете SimpleModal из: http://www.ericmmartin.com/projects/simplemodal_v101/

удачи!