单击按钮后，切换到其他页面并显示隐藏的内容

Question

I have some "Learn More" links on my Home page, all of which correspond to different sections of content that is on the More Info page. These different sections of content are all hidden using display: none.

What I'm wondering is if there's a way to make it so that when I click a particular "Learn More" link, the user will be sent to the More Info page, and the section of content corresponding to the Learn More link they clicked will be shown.

I can't think of a way to achieve this, but I'm hoping it will be possible, perhaps using JavaScript.

EDIT: The code I currently have is nothing special. Four <a> links on the Home page, then on the More Info page, four divs that are all initially hidden using display: none .

Answer 1

该解决方案最终变得非常简单，我做了此问题的最高答案中所述的操作： 获取URL哈希位置，并在jQuery中使用它

Answer 2

 <a href="javascript:showContent('id_here');">Learn more</a>

 <script>
    function showContent(id) {
        $("#"+id).show();
    }
 </script>

Answer 3

I think it is possible.You can take the information on a div,and then you click "Learn more",show the div. In this way,you even needn't a hyperlink,just a click event,like the code upstairs.Of course,this div was hidden before.

Answer 4

One way you can achieve this would be to add a hash to that link with the id of the section you want to show, like this: <a href="/moreinfo#section-id">Learn More</a> . Then just check for it in window.location.hash on the /moreinfo page and show the div.

Answer 5

You have to do it this way: try to use named anchors .

first:

<a href="your-page-url-here#section-3">Learn More</a>

when use clicks this link user will navigate to particular page with different sections.

second:

on this page suppose you want to show the 3rd section:

 .....
 <a name='section-3'></a>
 <h1>Your section-3</h1>

In your case divs are hidden then use js or jQuery for this:

As you will get a hash in the location url then use .substr()' and .indexOf()` javascript methods.

try to put this script on those page where you are having your hidden divs

$(function(){
   var url = window.location.href;
   var obj = url.substr(url.indexOf('#'));
   $(obj).show();
});