JQUERY ToggleClass 클래스 이름

-2

상기 코드들이받은

<script type="text/javascript"> 
$(document).ready(function(){ 
     $("input").click(function(){ 
      $(".ABC").toggleClass("else"); 
     }); 

}); 
</script> 


<body> 
    <p class="ABC">hahahahhaha</p> 
    <input type="button" value="click" /> 
</body>

분리 widthout, 의 클래스는 버튼 클릭에 의해 "다른 ABC"및 "ABC"사이에서 전환한다.JQUERY ToggleClass 클래스 이름

예를 들어

제 1 회 클릭 : 이 될 

2 클릭 : 는 

그러나, 나는 클래스 이름이 "ABC"와 "ABCelse"(사이 swiched 싶은 될 ABC와 그 사이의 공간 없음). 이 문제를 해결할 방법이 있습니까? 미리 감사드립니다.

출처

2011-09-07 Acubi

당신은 다음 무엇을 기대 바이올린입니까? 'ABCelse'? – yoda

그래서 클래스'ABC'를 제거하고 클래스'ABCelse'를 추가하고 싶습니까? –

왜 안 되니? '.else'에 새로운 스타일을 추가하기 만하면됩니다. –

우선, .toggle()이 div에 'else'클래스를 추가하기 때문에 그 사이에 공백이있는 이유가 있습니다. 그래서 지금은 두 개의 클래스가 있습니다 .ABC를 & .else

당신이 실제로 클래스 .ABC를 클래스 .ABC를 제거하고 추가 클래스 .ABCelse을, 또는 클래스 .ABCelse를 제거하고 추가되고 싶지 :

$('button').click(function(){ 
    $(this).find('.ABC').removeClass('ABC').addClass('ABCelse'); 
    $(this).find('.ABCelse').removeClass('ABCelse').addClass('ABC'); 
});

출처

2011-09-07 15:09:57 maxedison

한 번만 작동하지 않습니까? 명시 적으로 클래스를 제거하고 추가하기 때문에 클래스간에 앞뒤로 이동하는 원래의 기능이 제거됩니다. – Brandon

@Brandon 클래스가 배열이나 비슷한 것으로 저장되어 있으면 안됩니다. 선택할 필요가 없더라도 그렇게하지 않을 것입니다. – yoda

@Brandon. 내 대답을 편집했습니다. 필자가 제공 한 코드는 이제 원하는 방식으로 클래스를 효과적으로 전환합니다. – maxedison

다음과 같이 할 수 있습니다. ABC 클래스와 별도로 ABC 클래스를 토글합니다. 여기

$(this).find(".ABC").toggleClass("ABC").toggleClass("ABCelse");

출처

2011-09-07 15:10:51 Brandon

고마워, @ 브랜든. 어쩌면 나는 분명히 명확하지 않았다. 내가 원하는 건 className "ABCelse"이고 "ABC"는 버튼을 클릭하면된다. 그러나 "ABCelse"솔루션은 "ABC"로 바꿀 수 없다. – Acubi

@emily, 혼란스러워. 내 솔루션에서는 ABCelse를 ABC로 다시 변경할 수 있습니다. 이것이 토글 클래스가하는 것입니다. 그게 네가 원하는게 아니야? – Brandon

$(":button").click(function(){ 

    $("div").toggleClass(function(){ 

     if($(this).is(".ABC")){return "else";} 
     else if($(this).is(".else")){return "ABC";} 

    }); 
});

는 http://jsfiddle.net/DgAPR/

출처

2011-09-07 15:18:20 Rafay

JQUERY ToggleClass 클래스 이름

답변

관련 문제