제이쿼리 질문입니다.
본문
<script>
$(document).ready(function() {
$('li').click(function() {
if (this.id == "checking") {
$('#checking').addClass("on")
} else {
$('#checking').removeClass("on")
}
if (this.id == "checking2") {
$('#checking2').addClass("on")
} else {
$('#checking2').removeClass("on")
}
if (this.id == "checking3") {
$('#checking3').addClass("on")
} else {
$('#checking3').removeClass("on")
}
if (this.id == "checking4") {
$('#checking4').addClass("on")
} else {
$('#checking4').removeClass("on")
}
if (this.id == "checking5") {
$('#checking5').addClass("on")
} else {
$('#checking5').removeClass("on")
}
if (this.id == "checking6") {
$('#checking6').addClass("on")
} else {
$('#checking6').removeClass("on")
}
})
});
</script>
위 소스를 줄일려고 합니다
<li id="checking">
<li id="checking1">
<li id="checking2">
<li id="checking3">
<li id="checking4">
<li id="checking5">
<li id="checking6">
이렇게 되어있는데 소스를 줄이고 싶습니다.
답변 1
이런걸 하고 싶다는 것 같은데 맞는지 모르겟네요(이건 한페이지에 ul 태그가 하나만 존재해야할테죠)
$(function(){
$('li').click(function(){
$(li).removeClass('on');
$(this).addClass('on');
});
});
