jQuery UIスライダ値の変更

Question

これは私が解決しようとしているものです。基本的には、jQueryスライダuiを使用してチェックボックスをオンにしたときに、入力値を更新できるようにしたいと考えています。したがって、各チェックボックスは異なる値に対応します。チェックボックスをオンにすると、値が乗算されます。

問題は、より多くのスライドが発生したときにチェックされた番号を乗算しても問題にはならないということです。それは元の値に戻ります。

私はここで間違っていますか？

HTML

<input class="checkbox" type="checkbox">0.10 
<input class="checkbox" type="checkbox">0.25 
<input class="checkbox" type="checkbox">0.5 
<input class="checkbox" type="checkbox">0.75 
<input class="checkbox" type="checkbox">1.00 

<div class="increasedRevenue"><input id="increasedRevenueValue" value="0"></div> 

jQueryの

$('input:checkbox').click(function() { 
    $(this).siblings('input:checkbox').removeAttr('checked'); 
}); 

    $("#slider").slider({ 
     min: 100000, 
     max: 5000000, 
     step: 100000, 
     slide: function(event, ui) { 
      $("#increasedRevenueValue").val(ui.value); 

       $('input:checkbox').click(function() { 

        if($(this).is(":first-child")) { 
         $("#increasedRevenueValue").val($("#slider").slider("value") * 10);      
        } 
      }); 

     } 
    }); 

Answer 1

多くの問題がここにあります。

まず、チェックボックスに値が設定されていません。価値はどれくらいですか？スライダーに何を使用するかをスライダーにどのように伝えることができますか？あなたが使用している唯一の値は、最初のチェックボックスのみのチェックボックスの位置を使用することで10です。

次に、stepは変更されません。乗数を得るには、これを変更する必要があり、チェックされたボックスにバインドする必要があります。

次に、チェックボックスclickハンドラをスライドイベントの内側に配置しないでください。 slideは、スライダを移動するすべてのピクセルのチェックボックスに新しいクリックハンドラを追加しています。

コードのjsfiddleは違いがありますが、ステップは変更を見やすくするためのステップです。私が言及したいくつかの問題を修正するために何ができるかを参照して、フィドルを更新し、可能であれば新しいバージョンを保存するためにupdateボタンを押してください。