如何使用jquery和php鏈接到同一頁面中的特定部分？

Question

我知道要鏈接到同一頁面中的某個部分，例如：

<a href='#A'>A</a>

<a name='A'>Here is A</a>

但是當我用jquery和php設計它時，我遇到了問題。 我的設計就像：所有字母都是字母。 字母下有div（item_A，item_B，item_c等）。 例如，當用戶單擊K字母時，頁面將鏈接到#K div，並且#K div也顯示其內容。（因為當該站點首次打開時，item div的顯示為空）。 但是問題是，盡管#K（僅以K為例）顯示了K的內容，但是頁面沒有重定向到#K div。 您必須自己滾動。

這是代碼：

 <div class="content_letters">
      <ul>
      <?php $array_letter = array("A","B","C","Ç","D","E","F","G","H","I","İ",
                                  "J","K","L","M","N","O","P","R","S","Ş","T",
                                  "U","Ü","V","Y","Z");

      for ($i=0;$i<27;$i++) {

      echo "<li><a id='letter_{$array_letter[$i]}'
            href='#letter_{$array_letter[$i]}'>{$array_letter[$i]} | </a></li>"; 

       }
    ?>
     </ul>
</div>

<?php
    for ($i=0;$i<27;$i++) {
 ?>
    <div class="content_letter_block">
            <div class="text">
            <div class="show_hide">
              <a class="button" id="
               <?php echo 'button_letter_'.$array_letter[$i]; ?>">SHOW/HIDE</a>
            </div>

              <a name="<?php echo "letter_".$array_letter[$i].'">';?>
         <?php  echo $array_letter[$i]; ?></a> starts from here</div>

            </div>                          
    </div>

    <?php } ?>

    <div style='display:none'  id='<?php echo "item_".$array_letter[$i];?>'>    

      Here is item...
    </div>

這是jQuery代碼：

 $(document).ready(function() {
 // target everything with IDs that start with 'button_letter'

  $("[id^='button_letter']").click(function () {


// split the letter out of the ID
// of the clicked element and use it to target
// the correct div

$("#item_" + this.id.split("_")[1]).toggle();
});

$("[id^='letter']").click(function () {
$("#item_" + this.id.split("_")[1]).show();

});
});

Answer 1

沒有時間查看所有代碼，但是不能使用scrollTop（）方法嗎？
看這里 。

Answer 2

要將jQuery滾動到頁面中的特定ID，請使用

$('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');

Answer 3

您也可以在網址中指定錨。

<a href="your-page.html#k" />

單擊鏈接后，您將轉到該頁面，文檔將自動滾動到<a name="k">