1

以前にこの質問をしたことがありますが、誰も助けてくれないことに驚いています。ここで私が試みていることを正確に見ることができますhttp://training.mercury.stellarbluewebdesign.com/GainOil/ハンドルが解放されるまで、上部の値の更新が正しくないことに気付くでしょう。それらを計算する関数で ui.value を使用する必要があると言われましたが、正確な方法を誰も知らないようです。jqueryコードはこちらhttp://training.mercury.stellarbluewebdesign.com/GainOil/js/functions.js

4

3 に答える 3

0

inKitは正しいです。「slide」イベントは、コールバック関数が値の変化をキャンセルしない場合（たとえば、falseを返すことによって）に発生する値の変化を予測しています。ユースケースには理想的ではありませんが、このようにプログラミングすることで、開発者はスライドイベントの通過を許可するかどうかを選択できます。残念ながら、これは、コールバック関数が実行されている時点で、値が実際にはまだ更新されていないことを意味します。

変更される特定のスライダーの「将来」の値の受け渡しを処理できるようにcalculate_savings関数を変更するという、inKitの提案はおそらくより強力な解決策だと思いますが、取り組むことに興味があるよりも多くのリファクタリングが必要になる場合があります。

別の方法は、calculate_savings呼び出しを0ミリ秒のsetTimeoutでコールバックサイクルから切り離すことです。

コードの適切な部分は次のとおりです。

// hook all sliders to their span.value (display)
$( '.slider' ).bind( 'slide', function( e, ui )
{    
    var field = $( this ).attr( 'field' );
    var value = ui.value;
    var $matchingElem = $( '.value[field="' + field + '"]' )
    var decimals = $matchingElem.attr( 'decimals' ) || 0
    $matchingElem.text( addCommas( value ) )

    // Allow the slide event time to complete successfully and update the slider's value before calculating the savings.
    setTimeout(function(){calculate_savings();},0);
} )

動作中の新しいコードはここで見ることができます：http： //jsfiddle.net/maXcs/1/

注：更新が期待どおりに機能するようになったため、VIDesignzの提案に従ってslidechangeバインドを削除できるようになりました。

于 2012-11-14T04:06:17.250 に答える
0

呼び出している「スライド」イベントは、次の新しい値を渡しています。

var 値 = ui.value;

ただし、これはまだ実際の値が設定されているものではありません。値が設定されるのは、マウスを離すか、もう一度移動するまでではありません。

追加する場合：

var realval = $( ".slider" ).slider( "option", "value" );
console.log(realval);

スライド イベント関数に、計算の実行に使用されている数値が返されます。

その計算を実行するためにそれを渡すことができるcalculate_savings関数にパラメーターを追加する必要があります。しかし、あなたが持っているスライダーの数に基づいて、それは悪い考えかもしれません.

于 2012-11-14T02:59:54.820 に答える
0

これが右側の値を変更するコードである場合...

    // hook all sliders to their span.value (display)
$( '.slider' ).bind( 'slide', function( e, ui )
{   
    var field = $( this ).attr( 'field' );
    var value = ui.value;
    var $matchingElem = $( '.value[field="' + field + '"]' )
    var decimals = $matchingElem.attr( 'decimals' ) || 0
    $matchingElem.text( addCommas( value ) )
    calculate_savings();

} ).bind( 'slidechange', function()
{
    calculate_savings();
} ) // Ps. your missing a semicolon in your original script here <<<<

なぜ節約計算を別々にバインドするのですか?? これは代わりに機能しませんか？

        // hook all sliders to their span.value (display)
$( '.slider' ).bind( 'slide', function( e, ui )
{   
    var field = $( this ).attr( 'field' );
    var value = ui.value;
    var $matchingElem = $( '.value[field="' + field + '"]' )
    var decimals = $matchingElem.attr( 'decimals' ) || 0
    $matchingElem.text( addCommas( value ) )
    calculate_savings();

} );
于 2012-11-14T03:12:19.433 に答える