使用'href'来自其他页面

to reach (ie. to unhide) a particular div using 'href' from other page

本文关键字:其他 href 使用      更新时间:2024-02-29

有一个页面a有3个div(考虑)。我在另一个页面上也有一个链接。当用户点击链接时,他们必须到达pageA中的第三个div。如何做到这一点?

在我的代码中,所有div都是隐藏的,除了在时间因此不需要滚动。

演示

HTML:(PageA.HTML)

    <div id="mws-navigation">
        <ul id="link">
            <li class="" data-related="a" id="a1"><a href="#a"><i class="icon-book"></i>A</a></li>
            <li data-related="b" class="" id="b1"><a href="#b"><i class="icon-search"></i>B</a></li>
          <li data-related="c" class="" id="c1"><a href="#c"><i class="icon-calendar"></i>C</a></li>    
        </ul>
    </div>         
<!-- Main Container Start -->
<div id="mws-container" class="clearfix">
    <!-- Inner Container Start -->
        <div id="a" class="tab">
            aaaa
        </div>
        <div id="b" class="tab"> 
            bbbb
        </div>
        <div id="c" class="tab"> 
           cccc
        </div>
</div>

页面B.html:

<a href="PageA.html#c">vvv</a>// this link will be in other page(to reach C)

//我必须在herf=""中给出什么才能到达特定的div

JQuery:

$(function()
    {
            $('#link li').removeClass('actif');
            $(this).find('li').addClass('actif');
            $('.tab').hide();
            $('#a').show();
            document.getElementById('a1').className='active';
            $('#link li').click(function(e){
            $('#link li').removeClass('actif');
            $(this).find('li').addClass('actif');
            $('.tab').hide();
            $('#'+$(this).attr('data-related')).show();
            e.preventDefault();
});
    });

有什么建议吗?

好吧,我想你是说你想根据用户从另一个页面点击的内容来显示和关注某个特定元素。

在pageB上,在hrefs中向查询字符串添加一个参数,如下所示:

<a href="PageA.html?showdiv=c">vvv</a>

如果您有服务器端访问权限-java、php或其他什么,那么我建议使用它来处理查询字符串,并在页面上向div添加一个类

<div id="c" class="tab showAndFocus"> cccc</div>
var myElementToShow = $(".showAndFocus");
myElementToShow.show();
myElementToShow.focus();

然而,如果你只有jquery/javascript来完成这项工作(即没有服务器端来帮助你处理查询字符串),那么你就可以访问这里讨论的查询字符串参数

var urlParams;
(window.onpopstate = function () {
    var match,
       pl     = /'+/g,  // Regex for replacing addition symbol with a space
       search = /([^&=]+)=?([^&]*)/g,
       decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
       query  = window.location.search.substring(1);
       urlParams = {};
       while (match = search.exec(query))
           urlParams[decode(match[1])] = decode(match[2]);
})();

一旦有了查询字符串,就可以很容易地获取想要显示的div。。。

var myElementToShow = $("#"+urlParams.showdiv);
myElementToShow.show();
myElementToShow.focus();

当pageA加载时,您可以读取location.hash-在您的jQuery加载($)函数