2026, 새로운 도약을 시작합니다.

체크박스 도와주세요. 채택완료

안녕하세요

현재는 채크박스를 비활성화해서 체크되어 있게 보여주고 있는데요

<input type="checkbox" disabled=true value="동의" checked>

이렇게 하니까 색깔이 죽은것처럼 흐리게 나옵니다.

그래서 아래와 같이 변경하고 싶습니다.
 

기본적으로 체크가 항상 되어 있고

체크를 해제하면 글작성버튼을 누를수 없게하고

억지로 누르게 되면 '체크에 동의해주세요.' 라고

메시지를 보내고 싶습니다.

감사합니다. ㅠ

답변 3개

채택된 답변
+20 포인트

1. custom disabled checkbox

Copy




form label.custom input[type="checkbox"] {

    opacity: 0;

}

form label.custom:has(input[type="checkbox"]) {

    background-image: url('data:image/svg+xml;utf-8,');

    background-size: 100% 100%;

}

form label.custom:has(input[type="checkbox"]:checked) {

    background-image: url('data:image/svg+xml;utf-8,');

    background-size: 100% 100%;

}



 





$(function () {

    $('#frm').on('submit', function (evt) {

        if ($('#chk_submit').is(':checked') == false) {

            alert('체크에 동의해주세요.');

            evt.preventDefault();

        }

    });

});



 



    

    작성



2. submit button disabled dinamically

Copy






$(function () {

    $('#chk_submit').on('input', function (evt) {

        if ($('#chk_submit').is(':checked') == false) {

            $('#btn_submit').attr('disabled', true);

        } else {

            $('#btn_submit').attr('disabled', false);

        }

    });

});



 



    

    작성



로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

네 감사합니다.
2번재걸로 잘 적용하였습니다.
진짜 죄송하지만

체크를 해제 했을때
'동의를 해제하지 말아주세요'
라고 alert을 뜨게 할 수 있을까요?

다시 한번 감사합니다.
[code]
if ($('#chk_submit').is(':checked') == false) {
$('#btn_submit').attr('disabled', true);
alert('동의를 해제하지 말아주세요');
} else {
$('#btn_submit').attr('disabled', false);
}
[/code]

댓글을 작성하려면 로그인이 필요합니다.

색깔이 죽은것처럼 흐리게 나오는 이유는 

<input type="checkbox" disabled=true value="동의" checked> 

disabled=true 때문에 그런거구요...

기본적으로 체크가 항상 되어 있게 하고 싶으시면

<input type="checkbox" id=all_Chk value="동의" checked> 

스크립트 영역에 

$(function(){

$('#all_Chk').click();  하셔서 페이지가 시작되면 무조건 전체 체크박스를 클릭하도록 하시면 되고요..

});

나머지는 

배르만 님 소스를 활용하시면 될것같습니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

원하시는 답은 아닐 수 있는데 비슷하게요..

Copy






$( document ).ready(function() {

    $("input:checkbox").click(function() {

            alert('체크에 동의해 주세요.');

            return false;

     });

});



<input type="checkbox"   value="동의" checked>

===>    disabled=true 이건 빼주시고..

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고