0

我正在使用 jQuery Dialog 将其他页面加载到主页上的对话框中。其他页面可能有锚标签，我正在使用加载函数的完成事件来选择加载内容的 div 中的所有锚标签。然后，我连接锚标记单击事件处理程序，以便将内容加载到包含在主页上的 div 中。这有效，但是只有两次。当您运行下面的示例代码时，Partial1 将出现在对话框中。当我单击对话框中的 Partial2 链接时，Partial1 会加载到对话框中，但是，这次当我单击 Partial2 链接时，它会加载到主页中。我做错了什么和/或没有掌握？

主页/索引：

<a href="/Home/Partial1" id="help">Partial 1</a>

<div id="dialog" style="display: none">

</div>


<script type="text/javascript">
    $(document).ready(function () {
        $("#help").click(function () {
            adjustNestedAnchors($(this));
            $("#dialog").dialog().show();
            return false;
        });

        function adjustNestedAnchors(element) {
            $("#dialog").load($(element).attr("href"),
                function (response, status, xhr) {
                    if (status != "error") {
                        $("#dialog a").click(function () {
                                $("#dialog").load($(this).attr("href"), adjustNestedAnchors($(this)));
                                return false;
                        });
                    }
                });
        }
    });
</script>

主页/部分1

This is a sample partial view, which has a link back to <a href="/Home/Partial2">Partial2</a>.

主页/部分2

This is a sample partial view, which has a link back to <a href="/Home/Partial1">Partial1</a>.
4

1 回答 1

2

问题是这一行：

$("#dialog").load($(this).attr("href"), adjustNestedAnchors($(this)));

将在调用之前调用adjustNestedAnchors链接，因此在加载内容后不会调整嵌套锚点。loaddiv

相反，我相信你想要的是这样的：

<a href="/Home/Partial1" id="help">Partial 1</a>

<div id="dialog" style="display: none">

</div>


<script type="text/javascript">
    $(document).ready(function () {
        $("#help").click(function () {
            loadDialog(this);
            $("#dialog").dialog().show();
            return false;
        });

        // load link in dialog, and adjust its links to load inside it
        function loadDialog(link) {
            $("#dialog").load($(link).attr("href"), function (response, status, xhr) {
                $("#dialog a").click(function () {
                    loadDialog(this);
                    return false;
                });
            });
        }
    });
</script>

（免责声明：未经测试。）

请注意，我已重命名adjustNestedAnchors为loadDialog，我认为这是对其主要功能的更准确描述。

于 2013-06-23T18:43:45.767 回答