Question

我有两个具有自己的值和属性的滑块： http://i.stack.imgur.com/3OZqr.gif

我要做的是获取这两个滑块的值并执行一个计算，该计算将显示在兴趣标签旁边。计算结果为：磅* 0,008 *天。

我为凌乱的代码道歉，因为我还是初学者。

HTML

<div class="section">
  <p>
    <label for="amount1">£</label>
    <input type="text" id="amount1" />
  </p>
  <div id="Slider1"></div>
  <p>
    <label for="amount2">Days</label>
    <input type="text" id="amount2" />
  </p>
  <div id="Slider2"></div>
  <p>
    <label for="borrow">Borrowing</label>
    <input type="text" id="borrow">

    <label for="interests">+ Interest</label>
    <input type="text" id="interests">
  </p>
  <button onClick="totalinterest()">Try</button>
  <p id="interests"></p>
</div>

JS

$(function getslider1(pounds) {
  $("#Slider1").slider({
    max: 400,
    min: 50,
    value: 200,
    range: false,
    slide: function(event, ui) {
      var pounds = $("#amount1").val(ui.value);
      $("#borrow").val(ui.value);
      return pounds;
    }
  });
  document.getElementById("amount1").textContent;
});

$(function getslider2(days) {
  $("#Slider2").slider({
    max: 30,
    min: 1,
    value: 30,
    range: false,
    slide: function(event, ui) {
      var days = $("#amount2").val(ui.value);
      //("#interests").val(ui.value);
      return days;
    }
  });
  document.getElementById("amount2").textContent;
});

$(function totalinterest() {
  var int = (getslider1 * 0.008);
  var tint = (int * getslider2);
  //$("#interests").val(tinterest);
  var total = tint.valueOf();
  document.getElementById("interests").innerHTML = total;
});

Answer 1

嗨，我的朋友。

没有按钮使用此功能，兴趣值会自动进行计算

$('#Slider1').mouseup(function(){
    var pounds = $( "#Slider1" ).slider( "option", "value" );
var days = $( "#Slider2" ).slider( "option", "value" );
var total= pounds*0.008*days;
      document.getElementById("interests").value = total;
    }, function(){
    var pounds = $( "#Slider1" ).slider( "option", "value" );
var days = $( "#Slider2" ).slider( "option", "value" );
var total= pounds*0.008*days;
      document.getElementById("interests").value = total;
});


$('#Slider2').mouseup(function(){
    var pounds = $( "#Slider1" ).slider( "option", "value" );
var days = $( "#Slider2" ).slider( "option", "value" );
var total= pounds*0.008*days;
      document.getElementById("interests").value = total;
    }, function(){
    var pounds = $( "#Slider1" ).slider( "option", "value" );
var days = $( "#Slider2" ).slider( "option", "value" );
var total= pounds*0.008*days;
      document.getElementById("interests").value = total;
});

如果您想使用此按钮，请尝试

HTML按钮

<button id="btntot">Try</button>

<强> JS

$('#btntot').click(function(){
    var pounds = $("#amount1").val();
  var days = $("#amount2").val();
  var total = pounds*0.008*days;
  document.getElementById("interests").value = total;
});

jquery获取两个不同滑块的值并执行计算

1 个答案: