Javascript事件和递归问题

de90aj5v 于 2023-03-16 发布在 Java

关注(0)|答案(1)|浏览(118)

我正在使用jQuery Dialog将其他页面加载到主页面上的对话框中。其他页面可能有锚标记，我正在使用load函数的completed事件来选择div中的所有锚标记，内容将被加载到其中。然后，我连接锚标记的click事件处理程序，以便将内容加载到包含在主页面上的div中。但是只加载了两次。当你运行下面的示例代码时，Partial 1会出现在对话框中。当我单击对话框中的Partial 2链接时，Partial 1会加载到对话框中，但是这次当我单击Partial 2链接时，它会加载到主页面中。我哪里做错了和/或没有理解？

主页/索引：

<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>.

JavaScript

来源：https://stackoverflow.com/questions/17263697/javascript-events-and-recursion-issue

1条答案

按热度按时间

2vuwiymt1#

问题是这一行：

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

将在div上调用load * 之前 * 在链接上调用adjustNestedAnchors，因此在加载内容 * 之后 * 没有任何内容调整嵌套的锚点。
相反，我相信你想要的是这样的东西：

<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，我认为这是对其主要功能的更准确描述。

赞(0）回复(0）举报 2023-03-16

我来回答

Javascript事件和递归问题

1条答案

相关问题

热门标签

最新问答