Question

我试图获得4个简单输入滑块的平均值。我想在文本字段中显示平均值。我很确定我需要使用javascript / jquery。但我对它不太熟悉，所以我可能需要帮助。我很确定这很简单，但我不知道应该使用哪个事件处理程序等。

我有4个这样的滑块：

<div class="holder-left">
    <p>Subjektiv eller objektiv?</p>
    <input class="slider" type="range" min="1" max="5" value="3" />
    <div class="left">Subjektiv</div>
    <div class="right">Objektiv</div>
</div>

我会感激任何帮助。

Answer 1

试试这个

＆＃13;

$(".slider").change( function(e){
    var b=0;
    $('.slider').each(function(){
      var a=parseInt($(this).val());
      b=b+a;
    });
   var avg=b/4;
    $('#textValue').val(avg);
 });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
Result  - <input type="text" id="textValue" />
<div class="holder-left">
    <p>Subjektiv eller objektiv?</p>
    <input class="slider" type="range" min="1" max="5" value="3" />
    <div class="left">Subjektiv</div>
    <div class="right">Objektiv</div>
</div>
<div class="holder-left">
    <p>Subjektiv eller objektiv?</p>
    <input class="slider" type="range" min="1" max="5" value="4" />
    <div class="left">Subjektiv</div>
    <div class="right">Objektiv</div>
</div>
<div class="holder-left">
    <p>Subjektiv eller objektiv?</p>
    <input class="slider" type="range" min="1" max="5" value="3" />
    <div class="left">Subjektiv</div>
    <div class="right">Objektiv</div>
</div>
<div class="holder-left">
    <p>Subjektiv eller objektiv?</p>
    <input class="slider" type="range" min="1" max="5" value="5" />
    <div class="left">Subjektiv</div>
    <div class="right">Objektiv</div>
</div>

＆＃13;

平均4个滑块值

1 个答案: