將JS事件綁定到鏈接的最佳方法是什麼？

Href？

<a href="javascript:helloworld()">link</a>

onclick？

<a href="#" onClick="helloworld()">link</a>

框架綁定（例如jquery）？

<a id="foo" href="#">link</a> 
… 
$('#foo').live('click',helloworld);

來源

2012-01-08 gorootde

我認爲一個相關的問題就是爲什麼，如果您不希望點擊觸發頁面重新加載，就像''標籤通常那樣，您根本就使用''標籤。 – Pointy 2012-01-08 18:26:13

當然是最後一個，因爲它將內容與行爲分開。 – 2012-01-08 18:26:38

@Pointy因爲錨可以通過TAB訪問，而SPAN則不可以。另一方面，按鈕具有表現性問題（它們不像CSS那樣容易）。 – 2012-01-08 18:28:12

這取決於。通常，你應該從來沒有有一個什麼都不做的鏈接。如果您的用戶禁用了JavaScript，或者無法加載，該怎麼辦？你必須優雅地降低有一個可訪問的網站。因此，舉例來說，如果你有一個使用Ajax加載一個框，你應該有它鏈接到其他網頁，然後綁定在不顯眼的處理程序，單獨的JavaScript：

<a class="loadPage" href="actualPage.php">Go to my page</a>

和另一個文件：

$('.loadPage').click(function(e) { 
    // Load with Ajax... 
    e.preventDefault(); // Stop the link from going through 
});

如果用JavaScript生成的鏈接，那麼它沒關係使用#作爲href的大部分時間。但是，在這種情況下，您仍然應該使用JavaScript附加處理程序，而不是在innerHTML（* shudder *）中設置onclick。因此，一般來說：如果您的產品代碼中有onclick屬性或javascript:鏈接，那麼在您的HTML中，您不會分隔內容，行爲和演示文稿。你無法訪問;而你不是語義的。不要這樣做！

來源

2012-01-08 18:30:01 Ryan

以上都不是。

您應該將JS保存在一個外部文件中（關注點分離使代碼更易於管理和重用），並且使用庫可以平滑支持標準事件綁定的瀏覽器和舊版Internet Explorer之間的差異。

但是，JavaScript應該是unobtrusive。你不應該從頁面頂部的鏈接開始。

來源

2012-01-08 18:26:32 Quentin

請勿使用'javascript：myaction（）'。

總是喜歡使用框架，因爲它創建了一個真正的綁定（意味着通過瀏覽器窗口註冊事件）。所以最好的方法是： $（'＃foo'）。live（'click'，function（）{my action ....}）;

它也可以讓你保持你的JavaScript在一個單獨的文件，這是處理腳本的最佳做法。

第二好的方法是使用onClick事件。

來源

2012-01-08 18:28:35

請勿在HTML標記中使用javaScript！

$(function() { 
    var foo = $('#foo'); 

    if(foo[0]) { 
     foo.click(function(event) { 
      //.. 
      event.preventDefault(); 
     }); 
    } 
});

或使用on()因爲jQuery 1.7+

foo.on('click', function(event) { 
    //.. 
    event.preventDefault(); 
});

也不要使用live()從來沒有（截至jQuery 1.7，該.live()方法已過時）！

來源

2012-01-08 18:44:49 Duglas

將JS事件綁定到鏈接的最佳方法是什麼？

回答

相關問題