在使用jQuery時，我是否被迫使用href =“＃”？

Question

所以我寫了一小段jQuery，它使用.toggleTrigger和rel屬性來切換其他項目。

我遇到的第一個問題是，當我使用按鈕標簽時，它會打開，然后立即關閉。 如果我使用錨標簽，它工作正常。

第二個問題是，如果我向下滾動頁面並點擊一個錨標簽來切換它下面的東西，由於href="#"屬性，它會將我帶回到頁面頂部。

我知道這些必須是新手問題，但我不知道如何解決它們。

有人可以幫忙嗎？

我的href應該指向像href="#divThatWillBeToggled"這樣的東西

我被迫為toggleTrigger使用<a>標簽嗎？ 我不能使用<button>標簽？

編輯（原諒我，我是新來的和編程）

<a href="#" class="toggleTrigger">This is my Toggle Trigger</a>
<div class="toggle">This is info that is hidden and waiting to be toggled by the trigger</div>

信息隱藏，等待切換

Answer 1

href屬性必須包含在W3C標准定義的錨標記中。 但是，您不必使用href="#' 。您也可以使用href="javascript:void(0)" 。

或者，如果您不關心標准，則可以省略href ，但是光標不會像普通超鏈接一樣更改為指針。 您需要在錨點上的CSS中使用cursor:pointer 。

Answer 2

您需要設置錨點的“href”屬性，否則它不會引發其click事件。 要停止滾動行為，請使用preventDefault：

<a href="#">click me</a>

<script>
$(document).ready(function() {
   $("a").click(function(e) {
        e.preventDefault(); // prevent the default behavior (scrolling to the top)
        // perform other code
   });
});
</script>

Answer 3

在使用jQuery時，我是否被迫使用href =“＃”？

不，這是一種可怕的做法。 建立有效的東西 。

我遇到的第一個問題是，當我使用按鈕標簽時，它會打開，然后立即關閉。 如果我使用錨標簽，它工作正常。

這聽起來像你沒有做任何取消默認操作的事情，因此提交表格。 （這聽起來像服務器端替代方案與JavaScript不做同樣的事情，所以你不是進步的 ）

第二個問題是，如果我向下滾動頁面並點擊一個錨標簽來切換它下面的東西，由於href =“＃”屬性，它會將我帶回到頁面頂部。

URL #表示“當前頁面的頂部”。 如果您不希望在JS運行后遵循鏈接，則需要阻止默認操作（如上所述）。

我的href應該指向像href =“＃divThatWillBeToggled”這樣的東西

是。 默認情況下，div也不應該用CSS隱藏（你可以用JS立即隱藏它），這樣如果JS不可用，它仍然可見。

我是否被迫使用toggleTrigger的標簽？ 我不能使用標簽？

HTML就是標簽。 你的上一個問題沒有意義。

Answer 4

...由於href =“＃”屬性，它會將我帶回頁面頂部。

如果您通過JavaScript處理錨點擊，則在事件處理程序中使用event.preventDefault(); 或者return false; 取消默認操作（在鏈接后面）。

最好的辦法是讓鏈接真正鏈接到某個有用的位置，以便禁用JavaScript的用戶可以使用該頁面（這與網頁相關，而不是可以合理地需要JavaScript的Web應用程序，只要他們檢查它和如果找不到，則顯示一條好消息。 因此，而不是href="#" ，這在很大程度上是沒有意義的，它實際上會帶你到一個有意義的地方 - 但是然后用JavaScript覆蓋它（通過使用event.preventDefault();或者在處理程序中return false; ）。

Answer 5

event.PrevenDefault是你在尋找什么http://api.jquery.com/event.preventDefault/

Answer 6

像這樣寫錨標簽

href="javascript:"

例如

<a href="javascript:" id="myAnchorTagId">my anchor tag <a>

Answer 7

而不是＃，如果你願意，可以使用href="javascript:" 。