체크박스 체크값의 합을 구하고 싶습니다. 채택완료
<input type="checkbox" name="type_00" value="PC" <?if($w_type[0]):?> checked<?endif;?>>
PC
<input type="checkbox" name="type_01" value="PC Print" <?if($w_type[1]):?> checked<?endif;?>>
PC Print
체크박스를 체크한 수만큼의 합계를 구하고 싶습니다.
PC 체크박스를 클릭했다면 PC체크박스를 몇번 클릭했는지 숫자로 나타내주고 싶습니다.
PC=3번 이렇게요
어떻게 구현하면 될까요?
답변 2개
JavaScript
</p><p><script></p><p><span class="Apple-tab-span" style="white-space:pre"> </span>jQuery(function () {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var $type = jQuery("[data-bind-type]"),</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$disp = jQuery("div#dispCheckedCount");</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$type.bind("click", function () {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var data = {};</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$disp.empty();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$type.each(function () {</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if( this.checked === true )</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var type = jQuery(this).attr("data-bind-type")</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>className = "dispCheckedItem-"+type;</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if( typeof data[type] == "undefined" )</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$disp.append("<p class='"+className+"'>"+type+"=<span class='count'>1</span></p>");</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>data[type] = 1;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>else</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>data[type]++;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$disp.find("p." + className + " > span.count").text(data[type]);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p></script> </p><p>
HTML
</span></p><p><span style="line-height: 1.5;"></span><input type="checkbox" name="type_00" value="PC" data-bind-type="PC"> PC </p><p><input type="checkbox" name="type_01" value="PC Print" data-bind-type="PC">PC Print</p><p><input type="checkbox" name="type_01" value="16GB" data-bind-type="memory">memory 16GB</p><p><input type="checkbox" name="type_01" value="32GB" data-bind-type="memory">memory 32GB</p><p><div id="dispCheckedCount"><span style="line-height: 1.5;"> </span></p><p><span style="line-height: 1.5;"></span><span style="line-height: 1.5;">
대충이런식이 아닐까요?
댓글을 작성하려면 로그인이 필요합니다.
</p><p>$("input[type='checkbox']").click( function() {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var val = $(this).val(), m = val.match(/([^\d]+)(\d+)/);<span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if (!$.isArray(m)) $(this).val(val + '=1');</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>else $(this).val( m[1] + (Number(m[2]) + Number(1)) );<span class="Apple-tab-span" style="white-space:pre"> </span></p><p>}); </p><p>댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인