Прямая ссылка на вкладку specificc на странице html

Question

Я пытаюсь перенаправить страницу на конкретный TAB link. Например,

<a href="#google">google</a> 
     <a href="#facebook">facebook</a> 

<div class="tab containt"> 
    <div id="google"> 
     <p>some text some text some text some text</p> 
    </div> 

    <div id="facebook"> 
     <p>some text some text some text some text</p> 
    </div> 
</div 

Есть ли возможность перенаправить на конкретную вкладку?

http://example.com/#facebook

http://example.com/#facebook, поместив этот адрес в адресной строке. Его следует напрямую открыть вкладку facebook.

Answer 1

Добавьте ссылку на ссылку moveTo на нужную ссылку.

HTML

<a class="moveTo" href="#google">google</a><br/> 
<a class="moveTo" href="#facebook">facebook</a><br/> 

JQuery:

$(document).ready(function(){ 
    $(".moveTo").click(function(){ 
     var elemId = $(this).attr('href') 
     $(elemId).find('a:first').click(); 
    }); 
}); 

DEMO

Answer 2

Без больше требований, вы можете использовать :target селектор как чистый CSS решения.

URL-адреса с #, за которым следует имя привязки, ссылка на определенный элемент документа. Элемент, связанный с ним, является целевым элементом.

Целевой селектор можно использовать для создания текущего активного целевого элемента.

.tab > div { 
 
    display:none; 
 
} 
 

 
.tab > div:target { 
 
    display:block; 
 
}

<a href="#google">google</a> 
 
<a href="#facebook">facebook</a> 
 

 
<div class="tab containt"> 
 
    <div id="google"> 
 
    <p>some text some text some text some text - google</p> 
 
    </div> 
 
    <div id="facebook"> 
 
    <p>some text some text some text some text - facebook</p> 
 
    </div> 
 
</div>