通過點擊定位標記更改頁面的標題

使用Javascript，當點擊特定的定位標記時，如何更改頁面的標題。通過點擊定位標記更改頁面的標題

<a href="index.html" title="Home">Home</a> 
<a href="about.html" title="About Us">About Us</a>

可能是類似title =「」的錨標籤。另外，如果可能的話，你是否可以擁有它的支持歷史記錄，以便如果後退或前進按鈕被按下，它將變回原來的狀態。

任何幫助或建議表示讚賞。

修訂版：我有另一個動態更改頁面的插件，因此單擊上述語句中的鏈接實際上並不會更改標題中的任何內容。

來源

2016-01-28 Jr Kibbey

退房的History.pushState()方法：https://developer.mozilla.org/en-US/docs/Web/API/History/pushState

你可以用它來推動一個新的狀態到瀏覽器歷史，像這樣：

var state = { 'page_id': 1, 'user_id': 5 }; 
var title = 'Hello World'; 
var url = 'hello-world.html'; 

history.pushState(state, title, url);

這應該更改標題和網址，並允許您使用瀏覽器後退和前進功能

要使用此功能而不需要任何外部庫（如jQuery），可以將其添加到鏈接的onclick，例如：

<a href="index.html" title="Home" onclick="history.pushState({}, 'Home Page Title', 'home.html')">Home</a>

來源

2016-01-28 03:25:14

您提供的當前HTML代碼實際上會在單擊後將用戶帶到不同的頁面。因此，根據index.html和about.html的標題屬性，標題屬性可能與當前頁面不同。

如果你不想做頁面重新加載，並添加一個進入歷史，你可以做這樣的事情：

$('a').click(function(e) { 
    $('title').text($(this).attr('title')); 
    history.pushState({}, '', $(this).attr('href')); 
    e.preventDefault(); 
});

您可以瞭解更多有關.pushState(...) API這裏：https://developer.mozilla.org/en-US/docs/Web/API/History_API

來源

2016-01-28 03:27:14 michael

實際上，它是'history.pushState（...）'，否則會導致_is不是function_錯誤。 – Qdeep

錯字很好。我已經修復了代碼示例。 – michael

<html> 
<head> 
    <title>sample Page</title> 
<script src="http://code.jquery.com/jquery-1.10.2.js"></script> 

<script> 

     $(document).ready(function() { 
      $("a").click(function (e) { 
       e.preventDefault() 
       $('title').text($(this).attr('title')); 
       window.pushState({}, '', 'about.html'); 
       e.preventDefault(); 
      }); 
     }); 


</script> 
</head> 
<body> 
<a href="index.html" title="Home">Home</a> 
<a href="about.html" title="About Us">About Us</a> 

</body> 
</html>

來源

2016-01-28 03:35:23 Aswathy

通過點擊定位標記更改頁面的標題

回答

相關問題