2016-10-09 9 views
1

この作業を行うには問題があります。これはブートストラップとカスタムjqueryですが、私はあなたが見ることができると確信しているように、私は石の冷たい初心者です。Jquery:変数を選択して変数を選択して追加して送信する

<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> 

<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> 

コードは、選択された数値を表示し、それらを一緒に追加して提出バーに合計を表示するために、ダイのフィールドを更新し、あなたは2つのサイコロの結果を選択することができるようになっています提出がプッシュされると、3つの変数(die1、die2、およびrollTotal)を送信します。フィールドを更新することができなかったとき、私はそれを動作させて止めることができませんでした。

答えて

0

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つのフィールドを得たが、彼らはボタンを追加し、更新することはできません - また、次のハードルに私を持っており、この情報

を送信する方法
関連する問題