如何从AJAX打开的模态中的链接加载jQuery模态

How to load a jQuery Modal from links inside an AJAX opened Modal

本文关键字:模态 加载 jQuery 链接 AJAX      更新时间:2023-09-26

我已经阅读了一些答案,但没有一个符合我的问题:

  1. 我想从一个AJAX请求加载html到一个模态-(我已经有,它工作得很好)

  2. 我想点击加载模态内部的链接,然后打开另一个有更多细节的模态,可以有更多的链接到模态再次打开。-然后我可以拖动这些页面周围,并有很多打开。

所以很明显当我在加载的模态中点击链接时,它会进入那个页面,而不是在另一个模态中打开它。

<script type="text/javascript">
$(document).ready(function() {
    $('a.open').each(function() {
        var $link = $(this);
        var $dialog = $('<div></div>')
            .load($link.attr('href'))
            .dialog({
                autoOpen: false,
                title: $link.attr('title'),
                width: 600
            });
        $link.click(function() {
            $dialog.dialog('open');
            return false;
        });
    });
});

然后我的HTML是

<a href="reports?report=cows" class="open" title="Cows" class="open" >List Cows</a>

在加载的Modal中,html可以是:

<a href="reports?report=cow_detail" class="open" title="Cow Detail" class="open" >Cow #43</a> <br />...

这将打开另一个带有detail的Modal。

所以我正在寻找或期望能够加载后的第一点JavaScript模态加载,以获得新创建的class="open"标签,不会在文档加载时看到

感谢!

在加载模态窗口时使用该代码

$('#myModal').on('show.bs.modal', function (e) {
    $('a.open').each(function() {
        var $link = $(this);
        var $dialog = $('<div></div>')
            .load($link.attr('href'))
            .dialog({
                autoOpen: false,
                title: $link.attr('title'),
                width: 600
            });
        $link.click(function() {
            $dialog.dialog('open');
            return false;
        });
    });
});