jqueryハンドラで1つの関数が2度目に呼び出されないのはなぜですか？

Question

私はマウスを使って反応し、彩度を増減する2つのdivを作成しようとしています。ここに私の問題への短いフィドルは次のとおりです。 https://jsfiddle.net/ds6w5uwj/

$(document).ready(function() { 
    var oldbgc; 
    oldbgc = void 0; 
    return $(document.body).on('click', '.prio-step', function() { 
    var bg, newbgc; 
    alert("color recalc started"); 
    bg = $(this).css('background-color'); 
    oldbgc = rgb2hex(bg); //This line is only executed in the very first run 
    newbgc = applySaturationToHexColor(oldbgc, 30); 
    return $(this).css({ 
     backgroundColor: newbgc 
    }); 
    }); 
}); 

使用すると、1つのdivに最初の時間をクリックすると、rgb2hex（BG）が呼び出されると、正しい値がoldbgcに書き込まれます。しかし、あなたが再度divをクリックすると、スクリプトはNaNエラーにつながる特定の行をスキップします。 私はapplySaturationToHexColor(...)とrgb2hex(...)の両方の機能を、対応する質問の先頭の回答としてstackoverflow.comで見つけました。

Answer 1

コードに範囲の問題があります。

コード内に次の行があります。

rgb2hex= function(rgb_in) { <============= #1 
    // removed for simplicity 
}; 

applySaturationToHexColor= function(hex, saturationPercent) { 
    // removed for simplicity 
    rgb2hex = function(rgb) { <============= #2 
     return '#' + floatToHex(rgb[0]) + floatToHex(rgb[1]) + floatToHex(rgb[2]); 
    }; 
    newHex = rgb2hex(newRgbIntensityFloat); <============= #3 
    return newHex; 
}; 

$(document).ready(function() { 
    // removed for simplicity 
    $(document.body).on('click', '.prio-step', function() { 
     oldbgc = rgb2hex(bg); <============= #4 
    }); 
    // removed for simplicity 
    }); 
}); 

慎重にあなたはポインタ＃2でポインタ＃1と第2で1回、2回rgb2hexを定義している私は1,2,3および4として指摘している行を確認してください。だからあなたのオンクリックイベントの中でポインタ＃1で定義された関数を呼び出すつもりならば、あなたのコードはポインタ＃2で関数を呼び出すことになります。