1

[jsFiddle][1]

jQuery を使用して、オンデマンドで正しい (表示された) [knob][2] 値にアクセスする必要があります。機能については知ってい'change'ますが、一度に複数のノブの値にアクセスする必要があります。

これらの各ノブの値に特定の量を掛けてから、結果を合計する必要があります。'change'スクリプトがそれらの値を区別できるように、ノブidまたはその他の識別属性を提供する関数を取得する方法はありますか?

この計算関数は私がこれまでに持っているもので、すべてのノブで'change'、ボタンがクリックされたときにトリガーするようにしました:

function calculate() {
    var result = 0;
    $('.dial').each(function (e) {
        result += $(this).val(); //Multiply by 1 to get an int
    });
    $('#result').text((typeof result) + ' ' + result); //Why is this a string in the first place?
} 

これでノブをセットアップします:

$('.dial').each(function (e) {
        $(this).knob({
            max: 99,
            width: 120,
            height: 120,
            bgColor: '#85d4b0',
            fgColor: '#0ca961',
            inputColor: '#0ca961',
            thickness: 0.15,
            change: function (v) {
                console.log(v, this.v, this.cv);
                calculate(); //I need it to (re-)calculate every time any knob's value changes
            }
        });
    }

.val()遅れているように見えるため機能しません。初めて実行すると、結果は更新されず、連続して実行されますが、以前の値に変更されます。

何か案は?

編集:id値が変更されたノブを取得できれば、次のことができます。

var knobs = [{
    id: '',
    val: 0
}];
$('.dial').each(function () {
    $(this).knob({change: function(v, id){
        knobsMod(v, id);
    }});
});
$('.dial').parent().each(function (e) {
        $(this).attr('id', 'knob'+e);
        if (e > (knobs.length - 1)) {
            knobs[e] = $.extend({}, knobs[0]);
        }
        knobs[e].id = $(this).attr('id');
        knobs[e].val = $(this).val()*1;
});
function knobsMod(v, id){
    for (var i = 0; i < knobs.length; i++){
        if (knobs[i].id === id){
            knobs[i].val = v;
            break;
        }
    }
}

そして、knobs再計算するたびにオブジェクトを読み取ることができます。[1]: http://jsfiddle.net/SoullessWaffle/2mt2U/ [2]: http://anthonyterrien.com/knob/

4

1 に答える 1