Question

我为添加另一个jQuery问题而道歉，但是我已经对这段代码进行了长时间的反击。我的网站上使用了以下代码：brianjenkins94.tumblr.com，以便使用$ .get（）加载相应的内容来填充#iframe div。导航工作正常（保存从未配置的滚动器和滚动库中发生的令人讨厌的页面跳转）但我还没有能够根据document.location.hash属性提供的内容找出如何恢复页面内容。如果有人能够确定为什么这些代码无法正常运行，或者可能提供一些关于是否有更好的方法来实现这一目标的信息，那将非常感激。

提前谢谢，布赖恩

$(document).ready(function() {
    console.log("Executing embedded jQuery.")
    if (document.location.hash.length == 0) {
        $("#home")[0].click();
        console.log("Simulating #home link click.");
    } else {
        $(document.location.hash)[0].click();
        console.log("Simulating " + document.location.hash + " link click.");
    }

    $("#header #nav a").click(function() {
        if (!$(this).hasClass("active")) {
            $("#nav a").removeClass("active");
            $(this).addClass("active");

            document.location.hash = $(this).attr('href');

            switch (document.location.hash) {
                case "#home":
                    $.get("{text:DocumentRoot}index.html", function(data) {
                        $("#iframe").html(data);
                        console.log("Loaded index.html");
                    });
                    break;
                case "#showcase":
                    $.get("{text:DocumentRoot}showcase.html", function(data) {
                        $("#iframe").html(data);
                        console.log("Loaded showcase.html");
                    });
                    break;
                case "#about":
                    $.get("{text:DocumentRoot}about.html", function(data) {
                        $("#iframe").html(data);
                        console.log("Loaded about.html");
                    });
                    break;
                case "#github":
                    $.get("{text:DocumentRoot}github.html", function(data) {
                        $("#iframe").html(data);
                        console.log("Loaded github.html");
                    });
                    break;
                default:
                    console.log("No corresponding page.")
                    event.preventDefault();
                    break;
            }
        }
    });
});

修改：{text：DocumentRoot}是我设置的tumblr占位符值：https://rawgit.com/brianjenkins94/Sites/master/

Answer 1

您试图在实际设置事件之前触发事件。像这样重新组织您的代码：

$(document).ready(function() {
    console.log("Executing embedded jQuery.");

    $("#header #nav a").click(function() {
        if (!$(this).hasClass("active")) {
            $("#nav a").removeClass("active");
            $(this).addClass("active");

            document.location.hash = $(this).attr('href');

            switch (document.location.hash) {
                case "#home":
                    $.get("{text:DocumentRoot}index.html", function(data) {
                        $("#iframe").html(data);
                    });
                    break;
                case "#showcase":
                    $.get("{text:DocumentRoot}showcase.html", function(data) {
                        $("#iframe").html(data);
                    });
                    break;
                case "#about":
                    $.get("{text:DocumentRoot}about.html", function(data) {
                        $("#iframe").html(data);
                    });
                    break;
                case "#github":
                    $.get("{text:DocumentRoot}github.html", function(data) {
                        $("#iframe").html(data);
                    });
                    break;
                default:
                    event.preventDefault();
                    break;
            }
        }
    });

    if (document.location.hash.length == 0) {
        $("#home").trigger("click");
        console.log("Simulating #home link click.");
    } else {
        $(document.location.hash).trigger("click");
        console.log("Simulating " + document.location.hash + " link click.");
    }    
});

Answer 2

您可以直接在使用.click() jQuery对象选择器选择的链接上调用$("#home")。

$("#home").click();

似乎无法模拟jQuery链接点击

2 个答案: