基本的な Javascript の質問 - 現在のグローバル メソッドの代替ですか?
私は Javascript の経験はあまりありませんが、何年にもわたって Javascript のオンとオフを「手を出している」と言うことから始めます (主に、基本的な jquery を使用したことやフォームの計算を行うため)。
現在、jquery.ui ベースのスライダーを使用して電卓を作成しています。うまく機能していますが、昨夜、グローバル変数を使用して回避する必要があるという問題に遭遇しました。現在は機能していますが、これが正しい解決策であるとは思いません。
スライダーの外側の計算関数で、スライダー内からスライド イベントで呼び出されるこのような行から始めました。スライダー内で数学を上に移動することもできましたが、それは他の目的で使用されているため、必要に応じて呼び出すことができる外部関数として保持することをお勧めします。
savings = Math.round(cost[$('.selectable-div.selected').attr('id')] * $( "#slider-gallons" ).slider( "value" ); );
...しかし、おそらく「値」はスライダーが移動された後にのみ変更され、その間ではなく変更されるため、スライダーが現在どこにあったかではなく、スライダーが「開始」された場所に基づいて常に計算されますか? 1 位から 2 位に移動すると、1 位の結果が表示されます。2 位から 3 位に移動すると、2 位の結果が表示されます。3 位から 2 位に戻ると、 、それは私に位置3の結果を表示します（私が最後にいた方）。
ui.value を使用して、スライダー内に別の小さなコードがありました。これはリアルタイムで更新され、位置 1 は 1 を示し、位置 2 は 2 を示しました。その「スライダーガロン」ui.valueをスライダー関数自体の外側で呼び出す（IEは私の計算関数内）。
回避策として、ui.value をグローバル変数 "var_slider_gallons_pos" として定義し、次のように呼び出しました。
savings = Math.round(cost[$('.selectable-div.selected').attr('id')] * var_slider_gallons_pos );
それはうまく機能しますが、私はそれに満足していません。これを行う別の方法はありますか、IE（そして、以下のコードが機能しないことはわかっています。私が探しているものの単なる夢の例です）。余分な変数が浮かんでいる必要なく、スライダーの ui.value を直接呼び出すことができるものが欲しいだけです。
savings = Math.round(cost[$('.selectable-div.selected').attr('id')] * $( "#slider-gallons" ).slider( ui.value ); );
それが理にかなっているかどうかはわかりませんが、最初にスライダー イベント内から変数を作成することなく、スライダー要素の ui.value を呼び出そうとしています。
私はJavaScriptに精通していないため、これは私が見落としている基本的な要素であると確信しているので、誰かが私を助けてくれることを願っています.
編集:完全を期すために、現在使用している完全なスライダーと電卓のコードを次に示します。
スライダー：
$( "#slider-gallons" ).slider({
value:250,
min: 250,
max: 3000,
step: 250,
slide: function( event, ui ) {
var_slider_gallons_pos = ui.value;
$( "#slider-gallons-amount" ).html( "Your facility produces <span>" + var_slider_gallons_pos + "</span> Gallons of waste oil each year");
recalculateSavings();
}
});
/* these lines exist to populate the text values on load */
/* I could probably do the var_slider_gallons_pos part differently here as well */
var_slider_gallons_pos = $( "#slider-gallons" ).slider( "value" );
$( "#slider-gallons-amount" ).html( "Your facility produces <span>" + $( "#slider-gallons" ).slider( "value" ) + "</span> Gallons of waste oil each year");
そして計算機能：
function recalculateSavings() {
var cost = {
'calc-choice-natural-gas': 1.53,
'calc-choice-electric': 4.86,
'calc-choice-propane': 4.37,
'calc-choice-fuel-oil': 3.74
};
/* this is the line causing me grief */
savings = Math.round(cost[$('.selectable-div.selected').attr('id')] * var_slider_gallons_pos );
$('#savings-calculator .calc-savings-one-year .savings').html('$' + formatNumber(savings));
$('#savings-calculator .calc-savings-multiple-years .savings').html('$' + formatNumber(savings * var_slider_years_pos ));
}