使用 JQuery 獲取觸發事件的元素的類

Question

無論如何，當點擊事件被觸發時，是否可以獲得課程。 我的代碼如下，它只適用於 id 但不適用於 class。

 $(document).ready(function() { $("a").click(function(event) { alert(event.target.id + " and " + event.target.class); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <html> <body> <a href="#" id="kana1" class="konbo">click me 1</a> <a href="#" id="kana2" class="kinta">click me 2</a> </body> </html>

jsfiddle代碼在這里

Answer 1

嘗試：

$(document).ready(function() {
    $("a").click(function(event) {
       alert(event.target.id+" and "+$(event.target).attr('class'));
    });
});

Answer 2

這將包含完整的類（如果元素有多個類，則可能是多個空格分隔的類）。 在您的代碼中，它將包含“konbo”或“kinta”：

event.target.className

您可以使用 jQuery 按名稱檢查類：

$(event.target).hasClass('konbo');

並使用addClass和removeClass添加或刪除它們。

Answer 3

您將獲得以下數組中的所有類

event.target.classList

Answer 4

 $(document).ready(function() { $("a").click(function(event) { var myClass = $(this).attr("class"); var myId = $(this).attr('id'); alert(myClass + " " + myId); }); })

 <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script> </head> <body> <a href="#" id="kana1" class="konbo">click me 1</a> <a href="#" id="kana2" class="kinta">click me 2</a> </body> </html>

這對我有用。 jQuery 中沒有 event.target.class 函數。

Answer 5

如果您使用的是 jQuery 1.7：

alert($(this).prop("class"));

或者：

alert($(event.target).prop("class"));

Answer 6

小心， target可能不適用於所有瀏覽器，它適用於 Chrome，但我認為 Firefox（或 IE/Edge，不記得了）有點不同，它使用 srcElement。 我通常做類似的事情

var t = ev.srcElement || ev.target;

從而導致

$(document).ready(function() {
    $("a").click(function(ev) {
        // get target depending on what API's in use
        var t = ev.srcElement || ev.target;

        alert(t.id+" and "+$(t).attr('class'));
    });
});

謝謝你的好答案！

Answer 7

Vishesh 答案的改進，它返回一個布爾值：

event.target.classList.contains(className)

Answer 8

$(e.target).hasClass('active')

使用 JQuery 獲取觸發事件的元素的類

問題描述

8 個解決方案

解決方案1
145 已采納 2012-06-14 02:59:19

解決方案2
122 2012-06-14 02:59:29

解決方案3
25 2018-10-10 11:59:08

解決方案4
3 2012-06-14 03:07:24

解決方案5
1 2012-06-14 03:00:49

解決方案6
0 2016-02-23 19:43:03

解決方案7
0 2021-10-26 10:08:23

解決方案8
-1 2022-12-20 10:19:48

使用 JQuery 獲取觸發事件的元素的類

問題描述

8 個解決方案

解決方案1 145 已采納 2012-06-14 02:59:19

解決方案2 122 2012-06-14 02:59:29

解決方案3 25 2018-10-10 11:59:08

解決方案4 3 2012-06-14 03:07:24

解決方案5 1 2012-06-14 03:00:49

解決方案6 0 2016-02-23 19:43:03

解決方案7 0 2021-10-26 10:08:23

解決方案8 -1 2022-12-20 10:19:48

解決方案1
145 已采納 2012-06-14 02:59:19

解決方案2
122 2012-06-14 02:59:29

解決方案3
25 2018-10-10 11:59:08

解決方案4
3 2012-06-14 03:07:24

解決方案5
1 2012-06-14 03:00:49

解決方案6
0 2016-02-23 19:43:03

解決方案7
0 2021-10-26 10:08:23

解決方案8
-1 2022-12-20 10:19:48