从无线电表单添加整数值

时间:2016-11-17 03:38:47

标签: javascript jquery html forms

我正在尝试创建一个清单,根据单选按钮选择的值(使用jquery)提供总点数。每个输入的得分各不相同。

我可以获取个别值,但不知道如何添加它们?



/* jquery */

$(document).ready(function(){

  function setScore() {
    var score = $('input:checked').val();
    $('#score').text(score);
  }

    // set score on input change
  $('input').change(setScore);

    // set score on initialization
  setScore();

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li>
  <label>Facebook link?</label>
  <input type="radio"  class="radio" name="Facebook" value="4">Yes</input>
</li>

<li>
  <label>Instagram link?</label>
  <input type="radio"  class="radio" name="Instagram" value="6">Yes</input>
</li>

<span>Score: <span id="score"></span></span>
&#13;
&#13;
&#13;

感谢。

2 个答案:

答案 0 :(得分:2)

尝试将setScore功能更改为:

function setScore() {
    var score = 0;
    $.each($('input:checked'), function (i,input) { score += Number( input.value);});
    $('#score').text(score);
}

(假设没有需要排除的复选框输入)

<小时/> 要仅为已检查的Facebook和Instagram按钮添加值,可以使'input:checked'选择器更具体,例如:

':checked[name="Facebook"], :checked[name="Instagram"]'

答案 1 :(得分:0)

您可以尝试这种方式

&#13;
&#13;
$(document).ready(function(){
  function setTotalScore() {
    var score = 0;
    $('.radio').each(function(val,data){
        score+=parseInt(data.value.split('-')[1]);
    });
    $('#totalScore').text(score);
  }
  function setScore() {
    var score = $('input:checked').val();
    $('#score').text(score);
  }
  $('input').change(setScore);
  setTotalScore();
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li>
  <label>Facebook link?
      <input type="radio"  class="radio" name="social" value="Facebook-4">Yes</input>
  </label>
</li>
<li>
  <label>Instagram link?
      <input type="radio"  class="radio" name="social" value="Instagram-6">Yes</input>
  </label>
</li>
<p><strong>Individual Score:</strong> <span id="score"></p>
<p><strong>Total Score:</strong> <span id="totalScore"></p>
&#13;
&#13;
&#13;