Onclick 클래스의 가시성 변경

모든 목록 항목에 표시 : 인라인 스타일이있는 일련의 버튼과 UL이 있습니다.Onclick 클래스의 가시성 변경

사용자가 버튼을 클릭하면 특정 클래스의 모든 LI를 표시하고 싶습니다. jQuery를 선택기에 대한

<script> 
$(document).ready(function() { 
    $('.countrySelect').click(function() { 
     $(.Canada) 
     .css('display','block') 
    }); 
}); 
</script> 

<button type="button" class="countrySelect" name="United-Kingdom">UK</button> 
<button type="button" class="countrySelect" name="European-Union">EU</button> 
<button type="button" class="countrySelect" name="Canada">Canada</button> 

<ul> 
    <li><span class="United-States Hosted">Amazon Flexible Payment System</span></li> 
    <li><span class="United-States Hosted">Amazon Simple Pay</span></li> 
    <li><span class="United-States Canada Onsite">Authorize.net</span></li> 
</ul>

출처

2013-03-28 YourFriendJosh

이 같은 .Canada 따옴표가 필요합니다 :

여기

$(document).ready(function() { $('.countrySelect').click(function() { $('.Canada').css('color','red') }); });

가 동작하는 예제이다.'$는 (". 캐나다")' –

$('.countrySelect').click(function() { 
     $(".Canada").css('display','block'); 
    });

출처

2013-03-28 18:45:20 XTop

그는 또한 '$를 (사용할 수 있습니다 캐나다 ').숨는 장소(); 또는 $ ('. 캐나다') .fadeOut(); –

저는 항상 이것을 사용했습니다. 이는 CSS 속성을 변경하는데도 효과적입니다. –

@ClaudioLudovicoPanetta 당신은'$ ('. Canada')를 사용할 수 있습니다. hide(); $ ('. 캐나다'). fadeOut();'그대로 ... 그들은 완벽하게 괜찮습니다. – XTop

이 시도 :

$(document).ready(function() { 
    $('.countrySelect').click(function() { 
     $(".Canada").show(); 
    }); 
});

당신은 따옴표가 필요 예를 들어, 내 코드 (! jQuery를 비 작동으로 완료는)처럼 보인다 선택기이며 show()가 더 간단하다는 것을 알 수 있습니다 (특히 <span> 태그가 표시 : 기본적으로 인라인, 표시 : 블록이 아니기 때문에).

출처

2013-03-28 18:47:10 jszobody

여기에 .Canada과 함께 따옴표가 누락되었습니다. 이런 방식으로 사용 해보세요 : http://jsfiddle.net/SrpVG/

출처

2013-03-28 18:51:03

Onclick 클래스의 가시성 변경

답변

관련 문제