2014-06-19 2 views
0

체크 박스를 토글 버튼으로 변경하고 싶습니까? 내 입력 태그에는 레이블 태그가 없으며 수동으로 추가 할 수도 없습니다. 핵심 파일에 액세스 할 수 없기 때문입니다. CMS를 통해 내 파일에 jquery/script 및/또는 css를 추가 할 수 있습니다. 여기 확인란을 전환 버튼으로 전환

내가 체크 박스

<input type="Checkbox" name="savetheocean"> 

위해이 코드가 어떤 솔루션이 무엇입니까?

$('input[name="savetheocean"]').click(function(){ 
    if($(this).is(':checked')){ 
     //do something 
    } 
    else{ 
     //undo something 
    } 
}); 

UPDATE :

당신이 여기 데모 작업을 볼 수 있습니다

+0

무엇을 토글하고 싶습니까? –

+0

다음을 확인하십시오 : http://stackoverflow.com/questions/23102944/how-to-use-toggle-buttons-instead-of-checkboxes-radio-buttons –

+0

자세한 내용을 제공해주십시오. –

답변

0

은 기본적으로 이것은 당신이 토글 버튼으로 설정하는 방법입니다 http://jsfiddle.net/b4C7G/

+0

좀 더 알려주실 수 있습니까? 이것에 관한 세부 사항? 내가 본 다른 솔루션은 입력 태그를 사용하지 않습니다. – user3752575

+0

업데이트를 확인하십시오 –

+0

감사합니다 !! 그러나 나는 정말로 체크 박스 대신에 토글 버튼을 찾고있다. http://labs.engageinteractive.co.uk/itoggle/과 비슷한 것이지만 조금 복잡하다. – user3752575

0

http://i.stack.imgur.com/NmgLm.png

JSFiddle :

link

CSS :

a.toggler.on { 
    background: green; 
    cursor: pointer; 
    border: 2px solid black; 
    border-right-width: 15px; 
    padding: 0 5px; 
    border-radius: 5px; 
} 

a.toggler.off { 
    background: red; 
    border-right-width: 2px; 
    border-left-width: 15px; 
} 

HTML

<a href="#" class="toggler">&nbsp;</a> 

jQuery를

$(function() { 
    $('input[name="toggle"]').change(function() { 
     $("a.toggler").toggleClass("off", this.checked) 
    }).change(); 
})