테스트 사이트 - 개발 중인 베타 버전입니다

체크박스 숫자 계산 질문드립니다. 채택완료

다나한포션 2년 전 조회 1,946

안녕하세요

체크박스 클릭하면 하단에 자동으로 숫자가 합해져서 나오고 있습니다.

 

</p>

<p><script>

function calc( event )

{

  var result = 0;

  var obj;

  var form_obj = document[event.form.name];

  var form_length = form_obj['checkbox'].length;

  for ( var i=0; i<form_length; i++ )

  {

    obj = form_obj['checkbox'][i];

    if ( obj.checked == true )

      result += parseInt(obj.getAttribute('value'));

  }

  form_obj['result'].value=result;

}

</script></p>

<p> </p>

<p><ul></p>

<p><li>

<img src="thum1.jpg">

<p>테스트상품1</p>

<input type="checkbox" name="checkbox" value="1000" onclick="calc( this );" />1000

</li>

<li>

<img src="thum2.jpg">

<p>테스트상품2</p>

<input type="checkbox" name="checkbox" value="2000" onclick="calc( this );" />2000

</li></p>

<p></ul>

<div class="total">

<input type="text" name="result" value="0" /></p>

<p></div></p>

<p>

 

숫자합계는 잘되는데요..

이때 총합계 위에

테스트상품1 : 1000원, 테스트상품2 : 2000원

 

이런식으로 선택한 박스의 이름과 가격이 같이 뜨게 하고 싶습니다.

 

value 값에 이름과 가격을 동시에 넣는건 안될것 같고

 

제가 알고있는 한계치를 초과하여

염치없이 글을 올려봅니다.ㅠ

 

혹시 잘 알고 계신 고수님들 도움을 부탁드리옵니다...

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

답변 1개

채택된 답변
+20 포인트
2년 전

</p>

<p><script>

function calc( event )

{

  var result = 0;

  var desc_txt = [];

  var obj;

  // var form_obj = document[event.form.name];

  var form_obj = event.form;

  var form_length = form_obj['checkbox'].length;

  var desc = document.getElementById('desc');

  for ( var i=0; i<form_length; i++ )

  {

    obj = form_obj['checkbox'][i];

    if ( obj.checked == true ) {

      result += parseInt(obj.getAttribute('value'));

      desc_txt.push(obj.parentNode.querySelector('p').innerHTML);

    }

  }

  desc.innerHTML = desc_txt.join(',');

  form_obj['result'].value=result;

}

</script></p>

<p><form>

<ul>

<li>

<img src="thum1.jpg">

<p>테스트상품1</p>

<input type="checkbox" name="checkbox" value="1000" onclick="calc( this );" />1000

</li>

<li>

<img src="thum2.jpg">

<p>테스트상품2</p>

<input type="checkbox" name="checkbox" value="2000" onclick="calc( this );" />2000

</li>

</ul>

<div class="total">

  <div id="desc"></div>

<input type="text" name="result" value="0" />

</div>

</form></p>

<p>

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

답변에 대한 댓글 3개

다나한포션
2년 전
와. 정말 감사합니다. 대단하세요!!
제가 하고 싶은 딱 그대로 입니다. 정말 감사합니다!!
한가지더 정말정말 염치없지만 여쭤봐도 될런지요..
출력되는 상품명 옆에 (1000) 가격까지 넣고싶은데요 ㅠㅜ
가능하시면 부탁드리겠습니다.!!! 감사합니다!!!!
배르만
2년 전
[code]
// desc_txt.push(obj.parentNode.querySelector('p').innerHTML);
desc_txt.push(obj.parentNode.querySelector('p').innerHTML + ' (' + obj.value + ')');
[/code]
다나한포션
2년 전
정말감사합니다 선생님!!

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

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

로그인