분류 javascript

checkbox에 선택하면 금액이 자동합산돼 표시

컨텐츠 정보

  • 조회 3,822 (작성일 )

본문

<head> 

<SCRIPT LANGUAGE="JavaScript">

<!--

function checkChoice(whichbox) {

        with (whichbox.form) {

        if (whichbox.checked == false)

        hiddentotal.value = eval(hiddentotal.value) - eval(whichbox.value);

        else

        hiddentotal.value = eval(hiddentotal.value) + eval(whichbox.value);

        return(formatCurrency(hiddentotal.value));

        }

        }



function formatCurrency(num) {

        num = num.toString().replace(/\$|\,/g,'');

        if(isNaN(num)) num = "0";

        cents = Math.floor((num*100+0.5)%100);

        num = Math.floor((num*100+0.5)/100).toString();

        if(cents < 10) cents = "0" + cents;

        for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)

        num = num.substring(0,num.length-(4*i+3))+','+num.substring(num.length-(4*i+3));

        return (num + "원");

        }

//-->

</script>
</head>
<body>
<p align="center"><a href="http://daum.net">다음넷</a></p>
<p> </p>
<table cellpadding="2" cellspacing="0" bgcolor="#cccccc" align="center" width="621">


    <tr>

        <td width="288" bgcolor="white" valign="top">

        <form name=myform>
            <table cellpadding="3" cellspacing="1" width="100%" bgcolor="#CCCCCC">

                <tr>

                    <td width="34%" bgcolor="white" align="center">

                        <p>갯수 </p>

                    </td>

                    <td width="122" bgcolor="white" align="center">

                        <p>가격</p>

                    </td>

                    <td width="47" bgcolor="white" align="center">

                    <p>선택</p>

                    </td>

                </tr>

                <tr>

                    <td width="34%" bgcolor="white" align="center">

                        <p>1개</p>

                    </td>

                    <td width="122" bgcolor="white" align="center">

                        <p>100,000 원</p>

                    </td>

                    <td width="47" bgcolor="white" align="center">

<input type=checkbox name=Steak value="100000" onClick="this.form.total.value=checkChoice(this);">

                    </td>

                </tr>

                <tr>

                    <td width="34%" bgcolor="white" align="center">

                        <p>6개</p>

                    </td>

                    <td width="122" bgcolor="white" align="center">

                        <p>500,000 원</p>

                    </td>

                    <td width="47" bgcolor="white" align="center">

<input type=checkbox name=Chicken value="500000" onClick="this.form.total.value=checkChoice(this);">

                    </td>

                </tr>

                <tr>

                    <td width="34%" bgcolor="white" align="center">

                        <p>15개</p>

                    </td>

                    <td width="122" bgcolor="white" align="center">

                        <p>1,200,000 원</p>

                    </td>

                    <td width="47" bgcolor="white" align="center">

<input type=checkbox name=Sushi value="1200000" onClick="this.form.total.value=checkChoice(this);">

                    </td>

                </tr>

                <tr>

                    <td width="34%" bgcolor="white" align="center">

                        <p>합계</p>

                    </td>

                    <td width="176" bgcolor="white" colspan="2" align="center">

<input type="text" name="total" value="" size="10" readonly><input type=hidden name=hiddentotal value=0>

                    </td>

                </tr>

                </form>

            </table>

                                                                    </form>

        </td>

        <td width="325" bgcolor="white" valign="top">

            <table cellpadding="3" cellspacing="1" width="100%" bgcolor="#CCCCCC">

            <form name=myform2>

                <tr>

                    <td width="22%" bgcolor="white" align="center">

                        <p>갯수</p>

                    </td>

                    <td width="181" bgcolor="white" align="center">

                        <p>가격</p>

                    </td>

                    <td width="52" bgcolor="white" align="center">

                    <p>선택</p>

                    </td>

                </tr>

                <tr>

                    <td width="22%" bgcolor="white" align="center">

                        <p>10개</p>

                    </td>

                    <td width="181" bgcolor="white" align="center">

                        <p>300,000 원</p>

                    </td>

                    <td width="52" bgcolor="white" align="center">

<input type=checkbox name=Tea value="300000" onClick="this.form.total.value=checkChoice(this);">

                    </td>

                </tr>

                <tr>

                    <td width="22%" bgcolor="white" align="center">

                        <p>20개</p>

                    </td>

                    <td width="181" bgcolor="white" align="center">

                        <p>500,000 원</p>

                    </td>

                    <td width="52" bgcolor="white" align="center">

<input type=checkbox name=Cola value="500000" onClick="this.form.total.value=checkChoice(this);">

                    </td>

                </tr>

                <tr>

                    <td width="22%" bgcolor="white" align="center">

                        <p>50개</p>

                    </td>

                    <td width="181" bgcolor="white" align="center">

                        <p>1,000,000 원</p>

                    </td>

                    <td width="52" bgcolor="white" align="center">

<input type=checkbox name=Coffee value="1000000" onClick="this.form.total.value=checkChoice(this);">

                    </td>

                </tr>

                <tr>

                    <td width="22%" bgcolor="white" align="center">

                        <p>합계</p>

                    </td>

                    <td width="240" bgcolor="white" colspan="2" align="center">

<input type="text" name="total" value="" size="10" readonly><input type=hidden name=hiddentotal value=0>

                    </td>

                </tr>

                </form>

            </table>

        </td>

    </tr>

</table> 

javascript