jquery модальные окна - закрытие разочарований с помощью greybox и jqmodal - PullRequest
0 голосов
/ 05 августа 2009

Я уже некоторое время пытаюсь заставить модальные окна работать на новом сайте. Сначала я попробовал jqmodal, и у меня не было проблем с отображением модалов, но кнопки закрытия никогда не работали - или, по крайней мере, они работали на некоторых страницах, но не на других. Я приложил много усилий для отладки и не смог найти проблему.

Я недавно попробовал greybox, чтобы увидеть, повезло ли мне больше, но столкнулся с очень похожей проблемой. Кнопка закрытия в правом верхнем углу работает нормально, но я не могу сделать кнопку в модале, которая действует как закрытие. Я пробовал:

onclick="parent.parent.GB_hide();"

и аналогичные варианты, но они просто загружают все, что установлено в href в модале. Тем не менее, если я сделаю:

onclick="top.window.location.href='www.google.com'; parent.parent.GB_hide();"

это закроет модальное окно и откроет Google, как и предполагалось. Я не могу понять, почему я не могу создать кнопку, которая просто закроет ее.

Я чувствую, что упускаю что-то довольно фундаментальное, поскольку продолжаю сталкиваться с подобными проблемами. Кстати, сайт написан на ASP.NET MVC с jquery, и сейчас я в основном тестирую на Firefox.

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

Редактировать: Я до сих пор не знаю, как поступить. Идеи Ника были хорошо приняты, но я не вижу ошибок Javascript на странице ни с Firebug, ни с Venkman. Насколько я могу судить, окно должно закрываться.

Почему второе событие «onclick» выше, а не второе?

Ответы [ 2 ]

3 голосов
/ 05 августа 2009

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

Я просто собрал пример, используя jqModal:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script src="Scripts/tmp/jqModal.js" type="text/javascript"></script>
<style type="text/css">
    .jqmWindow
    {
        display: none;
        position: fixed;
        top: 17%;
        left: 50%;
        margin-left: -300px;
        width: 600px;
        background-color: #EEE;
        color: #333;
        border: 1px solid black;
        padding: 12px;
    }
    .jqmOverlay
    {
        background-color: #000;
    }
 .jqmWindow
    {
        position: absolute;

    }
</style>
<script type="text/javascript">
    $().ready(function() {
        $('#dialog').jqm();

        $('#jqmOpen').click(function() {
            $('#dialog').jqmShow();
            return false;
        });
    });
</script>
</head>
<body>
<a href="#" id="jqmOpen" name="jqmOpen">Open</a>
<div class="jqmWindow" id="dialog">
    <a href="#" class="jqmClose">Close</a>
    <input type="button" class="jqmClose" value="Close" id="jqmCloseBtn" name="jqmCloseBtn" />
    Some text in the modal dialog
   </div>
</body>
</html>

Я поместил гиперссылку и кнопку только для примера. Похоже, что jqModal нуждается / ищет класс для присоединения триггера закрытия.

EDIT:

Я только что попробовал ваш точный код сверху и не получил ошибку JavaScript, но ничего не произошло, чего и следовало ожидать, так как мой код не знает, что такое GB_hide () Так что это заставило меня задуматься.

Является ли кнопка, на которую вы нажимаете, вроде:

<input type="button" value="Close" id="Button1" name="Button1" onclick="parent.parent.GB_hide();" />

Если так, что такое parent.parent.GB_hide ()? Может ли GB_hide () быть функцией, которую вы не реализуете на этой странице.

Firebug показывает мне, что parent.parent является окном, поэтому после установки:

<script type="text/javascript">
    function GB_hide() {
        alert('Close');
    }
</script>

На странице теперь отображается предупреждение.

0 голосов
/ 23 марта 2012

, а не с помощью Google дать URL-адрес страницы, куда вы хотите перенаправить

 OnClientClick="top.window.location.href='http://localhost/yourpagename.aspx'; parent.parent.GB_hide();" 

- это код для закрытия и перенаправления серого поля jquery при нажатии кнопки.

...