簡體   English   中英

如何鏈接到Javascript創建之前不存在的錨標記?

[英]How can I link to an anchor tag that doesn't exist until the Javascript has created it?

我的頁面有一組<div>元素,每個頁面都有一個與之關聯的錨標記。 看起來像這樣:

<a name="anchor-0"></a>
<div id="div0">Some stuff</div>
<a name="anchor-1"></a>
<div id="div1">More stuff</div>
<a name="anchor-2"></a>
<div id="div2">Yet more stuff</div>

問題在於這組<div><a>標記是由Javascript生成的,因此直到創建頁面后它們才存在。 當我創建這樣的鏈接時:

http://www.mywebsite.com/mypage.html#anchor-2

...它會加載頁面,但不會跳轉到anchor-2位置,該位置僅在瀏覽器有時間執行生成該頁面的Javascript后的一段時間才會創建。

Javascript生成瀏覽器后,如何使瀏覽器移動到選定的定位器標簽位置?


本質上,這是生成HTML的Javascript的樣子:

function init() {
  gapi.client.setApiKey('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');
  gapi.client.load('blogger', 'v2', function() {
    var request = gapi.client.blogger.posts.list({
      'blogId': 'xxxxxxxxxxxxxxxxxxxxxxxx',
      'fields': 'items(content,title)'
    });
    request.execute(function(response) {
    var main = document.getElementById("main");
    var anchor = 0;
      for (var i = 0; i < response.items.length; i++)
      {
        var Div = document.createElement("div")
        $(Div).append(response.items[i].title);
        $(main).append(Div);
        anchor = document.createElement("a");
        anchor.name = "anchor-" + anchor;
        anchor = anchor +1;

      }
    });
  });
}

創建元素后,您可以執行以下操作:

location.hash = "#anchor-2";

或使用scrollIntoView

element = document.getElementById('your_element-id');
element.scrollIntoView();

通過執行以下操作從url獲取哈希值:

var hashVal = window.location.hash.substr(1);
//then jump to that hash
location.hash = "#" + hashVal;

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM