JQuery Smooth Scroll To DIV - ID değeri

Question

kullanarak JQuery'mde belirli div'lere kaydırmayı düşündüğüm bazı sorunlar yaşıyorum.

i yapmak kodudur istediğim şey HTML

<div id="searchbycharacter"> 
    <a class="searchbychar" href="#" id="#0-9" onclick="return false">0-9 |</a> 
    <a class="searchbychar" href="#" id="#A" onclick="return false"> A |</a> 
    <a class="searchbychar" href="#" id="#B" onclick="return false"> B |</a> 
    <a class="searchbychar" href="#" id="#C" onclick="return false"> C |</a> 
    ... Untill Z 
</div> 

<div id="0-9"> 
    <p>some content</p> 
</div> 

<div id="A"> 
    <p>some content</p> 
</div> 

<div id="B"> 
    <p>some content</p> 
</div> 

<div id="C"> 
    <p>some content</p> 
</div> 

... Untill Z 

JQuery

: Bir .searchbychar click olayı On A TAG> kimliğini alın değerini nitelikler ve o ilerleyin. ..

$('.searchbychar').click(function() { 

    $('html, body').animate({ 
     scrollTop: $('.searchbychar').attr('id').offset().top 
    }, 2000); 

}); 

Answer 1

Kimlikleri, kullandığınız bir sayıyla başlayan bir kimliği kullanmıyor asla benzersiz olması ve içindir şöyle hedef belirlemek yerine veri-nitelikleri: jquery gelince

<div id="searchbycharacter"> 
    <a class="searchbychar" href="#" data-target="numeric">0-9 |</a> 
    <a class="searchbychar" href="#" data-target="A"> A |</a> 
    <a class="searchbychar" href="#" data-target="B"> B |</a> 
    <a class="searchbychar" href="#" data-target="C"> C |</a> 
    ... Untill Z 
</div> 

:

Eğer ca sadece bu pasajı ile

<!-- jquery smooth scroll to id's --> 
<script> 
$(function() { 
    $('a[href*=\\#]:not([href=\\#])').click(function() { 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if (target.length) { 
     $('html,body').animate({ 
      scrollTop: target.offset().top 
     }, 500); 
     return false; 
     } 
    } 
    }); 
}); 
</script> 

: Burada

$(document).on('click','.searchbychar', function(event) { 
    event.preventDefault(); 
    var target = "#" + this.getAttribute('data-target'); 
    $('html, body').animate({ 
     scrollTop: $(target).offset().top 
    }, 2000); 
}); 

Answer 2

Bunu yapabilirsin:

()

F.Y.I.

• Sen kod ilk satırında gibi . (nokta) ile bir sınıf adı öneki gerekir. Ayrıca, $('.searchbychar').attr('id') kodunuz da jQuery nesnesi değil bir dize kimliği döndürecektir. Bu nedenle, .offset() yöntemini uygulayamazsınız.

Answer 3

benim çözümdür n Her biri için yeni bir betik yürütmek zorunda kalmadan sınırsız sayıda karma bağlantılar ve karşılık gelen kimlikler kullanın.

burada başka bir iş parçacığı nasıl çalıştığını zaten açıkladı: https://stackoverflow.com/a/28631803/4566435 bana bildirin, netlik için

(ya da burada bir direct link to my blog post var). Umarım yardımcı olur!