클릭 한 요소의 클래스를 얻는 방법?
class
클릭 한 요소 의 값 을 얻는 방법을 알 수 없습니다 .
아래 코드를 사용하면 매번 "node-205"가 나타납니다 .
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 :
<ul class="tabs">
<li class="node-205"></li>
<li class="node-150"></li>
<li class="node-160"></li>
</ul>
다음은 각 "li"태그에 click 이벤트를 추가 한 다음 clicked 요소의 클래스 속성을 검색하는 빠른 jQuery 예제입니다. 도움이 되길 바랍니다.
$("li").click(function() {
var myClass = $(this).attr("class");
alert(myClass);
});
마찬가지로 jQuery에서 객체를 래핑 할 필요가 없습니다.
$("li").click(function() {
var myClass = this.className;
alert(myClass);
});
최신 브라우저 에서는 클래스 이름 의 전체 목록을 얻을 수 있습니다 .
$("li").click(function() {
var myClasses = this.classList;
alert(myClasses.length + " " + myClasses[0]);
});
당신은 classList
사용하여 오래된 브라우저에서 에뮬레이트 할 수 있습니다myClass.split(/\s+/);
$("li").click(function(){
alert($(this).attr("class"));
});
나는이 질문을 보았으므로 조금 더 확장 할 수 있다고 생각했습니다. 이것은 @SteveFenton이 가진 아이디어의 확장입니다. click
이벤트를 각 li
요소 에 바인딩하는 대신 ul
아래쪽 에서 이벤트를 위임하는 것이 더 효율적 입니다.
jQuery 1.7 이상
$("ul.tabs").on('click', 'li', function(e) {
alert($(this).attr("class"));
});
선적 서류 비치: .on()
jQuery 1.4.2-1.7의 경우
$("ul.tabs").delegate('li', 'click', function(e) {
alert($(this).attr("class"));
});
선적 서류 비치: .delegate()
jQuery 1.3-1.4의 최후의 수단으로
$("ul.tabs").children('li').live('click', function(e) {
alert($(this).attr("class"));
});
또는
$("ul.tabs > li").live('click', function(e) {
alert($(this).attr("class"));
});
선적 서류 비치: .live()
트릭을 수행해야합니다.
...
select: function(event, ui){
ui.tab.attr('class');
} ,
...
ui.tab에 대한 자세한 내용은 http://jqueryui.com/demos/tabs/#Events를 참조하십시오.
$("div").click(function() {
var txtClass = $(this).attr("class");
console.log("Class Name : "+txtClass);
});
제공된 모든 솔루션을 사용하면 미리 클릭 할 요소 를 알아야합니다 . 클릭 한 요소 에서 클래스를 가져 오려면 다음을 사용할 수 있습니다.
$(document).on('click', function(e) {
clicked_id = e.target.id;
clicked_class = $('#' + e.target.id).attr('class');
// do stuff with ids and classes
})
참고 URL : https://stackoverflow.com/questions/964119/how-to-get-the-class-of-the-clicked-element
'IT story' 카테고리의 다른 글
":"를 awk 필드 구분자로 사용하는 방법은 무엇입니까? (0) | 2020.04.22 |
---|---|
pty와 tty는 무엇을 의미합니까? (0) | 2020.04.22 |
CSS3에서 div를 50px로 100 % 미만으로 만들 수 있습니까? (0) | 2020.04.22 |
오류와 경고를 파일에 기록하는 방법은 무엇입니까? (0) | 2020.04.22 |
Akka Streams를 시작하는 방법? (0) | 2020.04.22 |