Jquery : 변수를 선택하고 단추를 추가하여 추가 및 제출

Question

이 작업을 수행하는 데 문제가 있습니다. 이것은 부트 스트랩과 일부 사용자 정의 jquery이지만, 나는 돌이 차가운 초보자입니다.

<div style="height:12px;"></div> 
    <span id="d1">D1</span> - + - <span id="d2">D2</span> 
     <button type="button" class="btn btn-block " id="save"><i class="fa fa-cloud-upload"></i> SAVE <span id="subtotal" ></span></button> 

    <script> 
    $(document).ready(function(){ 
     $('#rolls label').click(function() { 
      var d1 = $(this).val(); 
      $(this).text(0); 
      var d2 = $(this).val(); 
      var rollTotal = d1 + d2; 
      $('#subtotal').text(rollTotal); 
      /* how to submit these variables */ 
     }); 
    }); 
    </script> 

코드

<form name="rolls" id="rolls"> 
<div style="height:6px;"></div> 
    <div class="btn-group btn-group-justified" id="die1" data-toggle="buttons" > 
       <label class="btn btn-primary"> 
        <input type="radio" name="die1" value="1" autocomplete="off" checked >1 
       </label> 
       <label class="btn btn-primary"> 
        <input type="radio" name="die1" value="2" autocomplete="off" >2 
       </label> 
       <label class="btn btn-primary"> 
        <input type="radio" name="die1" value="3" autocomplete="off" >3 
       </label> 
       <label class="btn btn-primary"> 
        <input type="radio" name="die1" value="4" autocomplete="off" >4 
       </label> 
       <label class="btn btn-primary"> 
        <input type="radio" name="die1" value="5" autocomplete="off" >5 
       </label> 
       <label class="btn btn-primary"> 
        <input type="radio" name="die1" value="6" autocomplete="off" >6 
       </label> 
     </div> 


<div style="height:12px;"></div> 

    <div class="btn-group btn-group-justified" id="die2" data-toggle="buttons" > 
       <label class="btn btn-info"> 
        <input type="radio" name="die2" value="1" autocomplete="off" >1 

       </label> 
       <label class="btn btn-info"> 
        <input type="radio" name="die2" value="2" autocomplete="off" >2 
       </label> 
       <label class="btn btn-info"> 
        <input type="radio" name="die2" value="3" autocomplete="off" >3 
       </label> 
       <label class="btn btn-info"> 
        <input type="radio" name="die2" value="4" autocomplete="off" >4 
       </label> 
       <label class="btn btn-info"> 
        <input type="radio" name="die2" value="5" autocomplete="off" >5 
       </label> 
       <label class="btn btn-info"> 
        <input type="radio" name="die2" value="6" autocomplete="off" >6 
       </label> 
     </div> 

은 당신이 두 주사위의 결과를 선택 선택한 번호를 표시하는 다이 필드를 업데이트, 그들을 함께 추가하고 제출 줄의 합계를 표시 할 수 있도록되어있다 제출이 푸시 될 때 3 개의 변수 (die1, die2 및 rollTotal)를 제출하십시오. 필드를 업데이트 할 수 없을 때 작동하지 못하고 중단 된 것처럼 보입니다.

Answer 1

link to a jsfiddle

 $(document).ready(function(){ 
     $('#die1 .btn').click(function() { 
      var d1 = $(this).text(); 
      $('#d1').text(d1); 
     }); 
     $('#die2 .btn').click(function() { 
      var d2 = $(this).text(); 
      $('#d2').text(d2); 
     }); 
      var rollTotal = $('#d1') +$('#d2'); 
      $('#subtotal').text(rollTotal); 
      /* how to submit these variables */ 
    }); 

은 2 개 필드가 업데이트 가지고 있지만 추가하고 버튼을 업데이트 할 수 없습니다 - 또한 다음 장애물에 저를 가지고, 어떻게이 정보를 제출