jQuery 如何获取被点击元素的类?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/964119/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to get the class of the clicked element?
提问by Fenton
I can't figure it out how to get the class
value of the clicked element.
我不知道如何获取class
被点击元素的值。
When I use the code bellow, I get "node-205"every time.
当我使用下面的代码时,我每次都会得到“node-205”。
jQuery:
jQuery:
.find('> ul')
.tabs(
{
selectedClass: 'active',
select: function (event, ui) {
//shows only the first element of list
$(this).children('li').attr('class');
},
cookie: { expires: 0 },
fx: fx
})
HTML:
HTML:
<ul class="tabs">
<li class="node-205"></li>
<li class="node-150"></li>
<li class="node-160"></li>
</ul>
回答by Fenton
Here's a quick jQuery example that adds a click event to each "li" tag, and then retrieves the class attribute for the clicked element. Hope it helps.
这是一个快速的 jQuery 示例,它向每个“li”标签添加一个点击事件,然后检索被点击元素的类属性。希望能帮助到你。
$("li").click(function() {
var myClass = $(this).attr("class");
alert(myClass);
});
Equally, you don't have to wrap the object in jQuery:
同样,您不必将对象包装在 jQuery 中:
$("li").click(function() {
var myClass = this.className;
alert(myClass);
});
And in newer browsers you can get the full list of class names:
$("li").click(function() {
var myClasses = this.classList;
alert(myClasses.length + " " + myClasses[0]);
});
You can emulate classList
in older browsers using myClass.split(/\s+/);
您可以classList
使用旧浏览器进行模拟myClass.split(/\s+/);
回答by Harpal
$("li").click(function(){
alert($(this).attr("class"));
});
回答by War10ck
I saw this question so I thought I might expand on it a little more. This is an expansion of the idea that @SteveFenton had. Instead of binding a click
event to each li
element, it would be more efficient to delegate the events from the ul
down.
我看到了这个问题,所以我想我可以再扩展一点。这是@SteveFenton 想法的扩展。与其将click
事件绑定到每个li
元素,不如从ul
下往上委托事件。
For jQuery 1.7 and higher
对于 jQuery 1.7 及更高版本
$("ul.tabs").on('click', 'li', function(e) {
alert($(this).attr("class"));
});
Documentation:.on()
文档:.on()
For jQuery 1.4.2 - 1.7
对于 jQuery 1.4.2 - 1.7
$("ul.tabs").delegate('li', 'click', function(e) {
alert($(this).attr("class"));
});
Documentation:.delegate()
文档:.delegate()
As a last resort for jQuery 1.3 - 1.4
作为 jQuery 1.3 - 1.4 的最后手段
$("ul.tabs").children('li').live('click', function(e) {
alert($(this).attr("class"));
});
or
或者
$("ul.tabs > li").live('click', function(e) {
alert($(this).attr("class"));
});
Documentation:.live()
文档:.live()
回答by jeroen.verhoest
This should do the trick:
这应该可以解决问题:
...
select: function(event, ui){
ui.tab.attr('class');
} ,
...
For more info about the ui.tab see http://jqueryui.com/demos/tabs/#Events
有关 ui.tab 的更多信息,请参阅http://jqueryui.com/demos/tabs/#Events
回答by Cybernetic
All the solutions provided force you to know the element you will click beforehand. If you want to get the class from any element clickedyou can use:
提供的所有解决方案都迫使您事先了解将单击的元素。如果要从单击的任何元素获取类,可以使用:
$(document).on('click', function(e) {
clicked_id = e.target.id;
clicked_class = $('#' + e.target.id).attr('class');
// do stuff with ids and classes
})
回答by Pushkraj
$("div").click(function() {
var txtClass = $(this).attr("class");
console.log("Class Name : "+txtClass);
});