2016-09-13 6 views
0

私はJquery Simple-Sliderを使用するだけで、2つのスライダのように両方の関数を合計してfunction.Belowを計算する方法についての知識が必要です私がやってみましたサンプルの一部です:私は私の答えを得て、私はので、私は自分の質問に答える代わりに、私の質問を編集することを決定したのと同じ問題を持つ他の人々のためにそれが役に立つ作ることができたようシンプルスライドから複数のデータを取得する方法

<div id="result"></div> 
<p>Bookeeper's salary (per month)</p> 
<div class="row"> 
    <div class="col-sm-12"> 
    <input style="padding-bottom:10px;" type="text" data-slider="true" value="0" data-slider-highlight="true" data-slider-range="0,10000" data-slider-step="1" 
    id="salary"> 
</div> 
</div> 
<br> 
<p>Average working days (per month)</p> 
<div class="row"> 
<div class="col-sm-12"> 
    <input type="text" data-slider="true" value="0" data-slider-highlight="true" 
    data-slider-range="0,31" data-slider-step="1" id="avgdays"> 
</div> 
</div> 
<div onclick="calcTotal()">an input or a tag here</div> 
-------script------- 
    $(document).ready(function(){ 
     $("[data-slider]") 
.each(function() { 
    var input = $(this); 
    $("<span>") 
    .addClass("output") 
    .insertAfter($(this)); 
}) 
.bind("slider:ready slider:changed", function (event, data) { 
    $(this) 
    .nextAll(".output:first") 
     .html(data.value.toFixed(3)); 
}); 


-------function-------- 
function calcTotal(){ 
//get the value from slider and put it in the total variable 
var total = salary value + average value; 
document.getElementbyId('result').innerHTML = total; 
} 

答えて

0

。だから、コードに追加するにはid = "result"というdivを含むブートストラップ・モダルを作ったので、スクリプトをリストするだけです。

$('#salary').bind("slider:changed", function(event, data){ 
    //get the value of id salary when slider is moved 
    salary = data.value; 
}); 

$('#avgdays').bind("slider:changed", function(event, data){ 
    //get the value of id avgdays when slider is moved 
    avgdays = data.value; 
}); 

//when modal is open shoot the function 
$('#myModal').on("shown.bs.modal", function(){ 
    document.getElementById('result').innerHTML = calcTotal(); 
}); 

//declare the variable of total 
var total; 
//function for calculating the total 
function calcTotal(){ 
    total = salary + avgdays; 
    return total; 
} 
関連する問題