如何防止滾動頁面的哈希標記鏈接？

這讓我絕對瘋了。我正在爲一個項目構建一個非常自定義的滑塊jQuery插件。我的要求之一是用戶必須能夠深入鏈接到特定幻燈片。所以自然，我的所有幻燈片都有散列標籤，導航鏈接也有相應的標籤。我的問題是哈希標記鏈接的默認功能是在由javascript觸發的滑動動畫之上觸發。也就是說，不是滑動到幻燈片4，而是立即跳到幻燈片4，然後動畫到幻燈片8.這是儘管我可以想到的每一個技巧，以防止默認功能。以下是有問題的代碼片段。如何防止滾動頁面的哈希標記鏈接？

$(slider.nav).bind('click', function(event) { 
    event.preventDefault(); 
    if(!$(this).hasClass('active')) { 
     var target = slider.nav.index($(this)); 
     slider.animate(target); 
    } 
});

正如你在這裏看到的，我使用了event.preventDefault（）。我也嘗試過返回false。沒有任何運氣。有任何想法嗎？

來源

2011-11-11 user1040878

http://jsfiddle.net/36vQ7/1/ –

很難說沒有看到HTML。但如果這是我想象的方式，那麼如果鏈接不在任何地方，則不需要在鏈接中保留href =「＃」。您可以使用jQuery獲取下一張幻燈片，或者在不依賴href =「＃」鏈接的情況下獲取第7張幻燈片。

相反，你可以這樣做：

<ul id="slideshow"> 
    <li id="slide_1">Slide 1</li> 
    <li id="slide_2">Slide 2</li> 
    <li id="slide_3">Slide 3</li> 
</ul> 

<a class="slide_nav" data-index="1">1</a> 
<a class="slide_nav" data-index="2">2</a> 
<a class="slide_nav" data-index="3">3</a> 
<a class="slide_nav" data-index="4">4</a>

而在JS，做這樣的事情：

$('.slide_nav').click(function() { 
    var slides = $('#slideshow li'); // get all slides 
    var target_id = $(this).data('id') - 1; // Get the current ID and then subtract 1 (index starts at 0) 
    slider.animate(slides[target_id]); 
});

無論如何，這更像是一個僞例如比什麼都重要，我我不確定這樣做是否可以工作，但是代碼應該指向一個避免使用href =「＃」的方向，從而避免你現在遇到的問題。

祝你好運。哦，jeeze。

來源

2011-11-11 01:41:33 Jemaclus

你也可以在'.ready（）'上將一個帶'＃'的實際鏈接轉換爲'data-index'或'rel'屬性，然後將'href'清零。 –

哦，jeeze。我真的很抱歉。我浪費了每個人的時間。

顯然另一個開發誰是工作在網站上添加了一些JavaScript其他地方大致到

if(window.location.hash) { 
    window.location = window.location.hash; 
}

不知道他們爲什麼會增加這樣的事情的影響。抱歉!

來源

2011-11-11 16:25:32 user1040878

如何防止滾動頁面的哈希標記鏈接？

回答

相關問題