有没有可能制作一个链接到一页的网页，打开并定位在特定的文章中

Is it possible to make a link to a one page webpage to open and position itself at a specific article?

本文关键字：网页 文章 定位 一页 有可能 链接 一个      更新时间：2023-09-26

有没有一种方法可以通过外部链接打开特定文章，并在单页微信上打开链接时关注它？

我有一个网页，当你点击链接时，通过隐藏和显示div来显示内容。我想要的是以mywebpage/（div的名称）的形式创建一个指向我的网页的外部链接，并让该链接打开我的页面，但立即显示该div的内容，而不是单击普通的mywebpage链接时通常会看到的打开内容。

有可能吗？如何？

简短回答：是。

长话短说：你必须在页面加载时检查URL的哈希，并手动将其转换为隐藏或显示的div（或其他定位）。

当你在做的时候，当你的div打开和关闭时，你可以包括浏览器历史记录支持。

拆散我的一切http://www.tipmedia.com（段从页面源的第322行开始）

//on page ready
$(document).ready(function() {
    //examine hash
    if(window.location.hash == "#thanks") {
        //scroll to an anchor tag, slight delay to insure correct page height
        setTimeout(function() {
            $('html,body').animate({scrollTop:$("#contact").offset().top}, 0);
        },500);
        //hide and show necessary divs
        $("#contactThanks").css({"display":"block"});
        $("#contactIndex").css({"display":"none"});
        $("#contactGeneral").css({"display":"none"});
        $("#contactMeeting").css({"display":"none"});
        $("#contactCareers").css({"display":"none"});
        //clear the hash (not necessary for your use)
        window.location.hash = "";
    }
}

历史记录也很简单，我使用了Modernizer.js来获得最佳的跨浏览器支持，但它看起来是这样的（非Modernizer的使用非常相似）

//during the hide/show of new content...
    //if history is available
    if(Modernizr.history) {
        //this data is whatever it is you wish to save
        lastPageState = { div:divName, pos:amount, page:lastLoadedPage };
        history.pushState(lastPageState, divName.substring(1,divName.length-6), "index.html");
    }
//...
//then later, the popsate event handler
window.onpopstate = function(event) {
    //examine event.state and do whatever you need to
    //example segment starts line 989
    //Whatever data you saved would be read here and you would do the appropriate action,
    //hiding or showing divs, reloading AJAX content, etc.
}

是的，您可以使用锚链接。因此，在目标页面中，用id命名div，比如div id="target"。然后在参考页面中使用以下形式的链接

参考页面：<a href="/mywebpage#target">GO to Target Info...</a>

目标页面：

<div id="target">
...content...
</div>

仅供参考-"target"只是一个示例名称，它可以是任何。。。

相关文章：