Question

我的网站使用asp.net mvc 4.0开发。通过在后台加载html完成页面导航（使用iframe）。这是过程：

执行正常页面加载
所有超链接都绑定了其点击处理程序以执行后台加载
当超链接点击使用适当的超链接网址
当iframe页面加载其内容后附加到主页
重复步骤2

步骤1到步骤4很好但步骤5，在步骤5之后点击超链接而不是后台加载整个页面加载，所以这意味着在iframe加载的页面后jquery无法绑定超链接的click事件

这个问题只出现在最新的谷歌Chrome版本37.0.2062.120它在firefox上工作正常，即10.我甚至安装旧版本的谷歌浏览器（版本36.0.1985.143），一切正常。

我知道我可以在Google Chrome错误列表中报告问题。但我不能等到我的网站错误，直到谷歌修复此错误。

那么有没有办法解决这个问题，还是有一个技巧可以追踪为什么没有正确调度click事件处理程序？

网站规格：
- asp.net mvc 4
- jquery 1.7.2

修改

我设法创建简单的代码来模仿我的问题：http://ktutnik.com/index.html

因此，当用户点击任何超链接时，“test.html”内容将自动附加到正文中。

index.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="/Scripts/jquery-1.7.2.js"></script>
    <script>
        $(function () {
            bindHyperlinks($('body'));;
        });

        function bindHyperlinks(root) {
            root.find('a').click(function () {
                var url = $(this).attr('href');
                loadPage(url, function (html) {
                    $('body').append(html);
                    bindHyperlinks(html);
                });
                return false;
            });
        }

        function loadPage(url, cb) {
            var frame = $('<iframe/>');
            frame.hide();
            $('body').append(frame);
            frame.load(function () {
                var content = $(this).contents().find('body').children();
                cb(content);
                frame.remove();
            });
            frame.attr('src', url);
        }
    </script>
</head>
<body>
    <a href="/test.html">Load page</a>
</body>
</html>

test.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <div>
        <a href="/test.html">Go to test</a>
    </div>
</body>
</html>

Answer 1

如果没有代码段，很难确定。

您想要检查的几件事情是：

确保从事件处理程序返回false。
确保在添加新事件处理程序之前删除了事件处理程序（例如$("#myElement").off("click").on("click", function(e) {});

我构建了我的不是可行的方法，但是使用jQuery，您可以使用$.get下载页面内容然后将其嵌入页面，或者（我会推荐）您可以使用像Sammy之类的东西来处理你的粗加工。

Answer 2

不确定是正确的做法 - 回答但是它解决了我的问题

在iframe加载事件而不是

var content = $(this).contents().find('body').children();
cb(content);

我用过

var content = $(this).contents().find('body').html();
cb($(content));

从技术上讲，它们具有相同的含义，奇怪但是它的工作！

超链接点击事件不适用于谷歌浏览器37.0.2062.120

2 个答案: