使用FontAwesome等圖標字體時，如何使圖標在jQuery中可綁定？

使用Font Awesome，我想使用圖標刪除圖標。所以我在我的HTML中有<i class="icon-remove"></i>，這很好。但是，我想在jQuery中使用這個綁定來爲我關閉div。使用FontAwesome等圖標字體時，如何使圖標在jQuery中可綁定？

所以我用：

$(".icon-remove").click(function() { 
     alert("HELLO"); 
     $(".login-window").hide(); 
     $(".register-window").hide(); 
     $(".shadow").hide(); 
    });

但是，這是行不通的。當我點擊它時，沒有任何反應。

這是我用過的CSS（也是注意：cursor: pointer;不起作用）。

.icon-remove { 
    display: block; 

    color: #444; 
    cursor: pointer; 
    float: right; 
    margin-right: 15px; 
}

我究竟做錯了什麼？

來源

2013-02-13 Doug Smith

如果圖標在頁面加載後動態添加，則該點擊事件將不起作用。您需要改用on。

下面是使用它的方法之一：

$(document).on("click", ".icon-remove", function() { 
    alert("HELLO"); 
    $(".login-window").hide(); 
    $(".register-window").hide(); 
    $(".shadow").hide(); 
});

來源

2013-02-13 17:17:35 frostyterrier

我使用該代碼逐字，它仍然無法正常工作。：/ – 2013-02-13 17:56:56

好吧，在這種情況下，下一步是檢查Leniel建議的錯誤，併發布任何你找到的內容。如果你沒有發現任何錯誤，你需要發佈更多的代碼或給出一個工作演示。 – frostyterrier 2013-02-13 18:17:48

爲我工作，謝謝！ – F481 2014-04-05 17:10:25

您的代碼就可以了。也許你的JavaScript代碼中有一些錯誤會阻止整個事情的發揮。例如，在Firefox上使用Firebug，您可以檢查控制檯選項卡，查看代碼中是否有錯誤。

這裏的JS斌對代碼進行測試：http://jsbin.com/obogof/4

對於CSS一部分，你必須確保你的CSS代碼來後影響.icon-remove類的任何其他CSS規則。它在這裏正確地工作：http://jsbin.com/obogof/5

來源

2013-02-13 17:17:37

沒有其他規則影響'.icon-remove'類。：/ – 2013-02-13 18:04:26

您是否在JavaScript課程中發現任何其他錯誤？ – 2013-02-13 18:05:11

完全有可能，我只是沒有正確使用控制檯，但沒有，當我點擊任何東西出現在控制檯。 – 2013-02-13 18:19:35

DOM準備好後，您的JavaScript執行嗎？您將需要以下內容：

$(document).on("click", ".icon-remove", function() { 
    alert("HELLO"); 
    $(".login-window").hide(); 
    $(".register-window").hide(); 
    $(".shadow").hide(); 
});

來源

2013-02-13 17:18:47

使用FontAwesome等圖標字體時，如何使圖標在jQuery中可綁定？

回答

相關問題