スライダでフォームに入力された値は、手動でフォーム

Question

に入力しない限り保存されません。スライダを使用して値を選択してクリックすると、値を保存しませんフォームに入力してキーまたはキーボードをクリックすると、引用符をクリックすると保存されて表示されます。私が間違っていることを理解していない、助けてください。これはそのような頭痛です。

https://jsfiddle.net/p58s0dpr/

関連するすべてのコードは、htmlタグであり、jsはloopj.comからの簡単なスライダーです。

<script> 
     $("[data-slider]") 
      .each(function() { 
      var input = $(this); 
      //$("<span>") 
      // .addClass("output") 
      // .insertAfter($(this)); 
      }) 
      .bind("slider:ready slider:changed", function (event, data) { 
      $(this) 
       $("#bitcoin").val(data.value.toFixed(6)); 
       $("#cad").val(((data.value.toPrecision(4)*1209.60).toFixed(2))); 
      }); 
      </script> 

<input id="bitcoin" type="form" placeholder="0.002 to 0.08" maxlength="8" pattern="\d*\.\d*" onchange="bitcoinCheck(this);">Bitcoin</input> 

       <script> 
        function bitcoinCheck(input) { 
         if (input.value < 0.002) input.value = 0.002; 
         if (input.value > 0.08) input.value = 0.08; 
        } 
       </script> 

<p id="btc-amount"> 

       <script> 
        document.getElementById('bitcoin').onkeyup = function() { 
        if (this.value < 0.002) this.value = 0.002; 
        if (this.value > 0.08) this.value = 0.08; 
        var bitcoin = (this.value); 
        document.getElementById("btc-amount").innerHTML = "BTC amount requested: " +bitcoin; 
        } 
       </script> 

      </p> 

Answer 1

onkeyupキーリリースをリッスンします。そのため、キーボードを使用すると値が更新されるのです。

あなたが望む動作をするには、クリックイベントを引用ボタンに付ける必要があります。これはjQueryで行うことができます：

$('#button1').on('click', function() { 
    var coinAmount = $('#bitcoin').val(), 
     coinContent = 'BTC amount requested: ' + coinAmount, 
    dollarAmount = $('#cad').val(), 
    dollarContent = 'Market: $' + dollarAmount; 

    $('#btc-amount').html(coinContent); 
    $('#cad-quote').html(dollarContent); 
});