JS 첵박스 샘플

by 조쉬 posted Jun 04, 2019
?

단축키

Prev이전 문서

Next다음 문서

ESC닫기

가 크게 작게 위로 아래로 댓글로 가기 인쇄 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/JavaScript">
        function chkBox(bool) { // 전체선택/해제 
            var obj = document.getElementsByName("chk[]");
            for (var i = 0; i < obj.length; i++) obj[i].checked = bool;
            document.getElementById('checked').innerHTML = (bool) ? '해제' : '선택';
        }
        function revBox() { // 전체반전 
            var obj = document.getElementsByName("chk[]");
            for (var i = 0; i < obj.length; i++) obj[i].checked = !obj[i].checked;
        } 
</script> 
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table border=1> 
            <tr bgcolor=#efefef> 
            <td><INPUT type=checkbox onclick=chkBox(this.checked)><span id='checked'>선택</span></td> 
            </tr> 
            <tr><td><INPUT type=checkbox name=chk[] value=100> 이효리</td></tr> 
            <tr><td><INPUT type=checkbox name=chk[] value=200> 성유리</td></tr> 
            <tr><td><INPUT type=checkbox name=chk[] value=300> 이진</td></tr> 
            <tr><td><INPUT type=checkbox name=chk[] value=400> 옥주현</td></tr> 
        </table>
        <INPUT type=button value="전체반전" onclick=revBox()> 
    </div>
    </form>
</body>
</html>

위로 아래로 댓글로 가기 인쇄