0

jQueryを使用してbackground-color表のセルを編集しています。私のコードは次のとおりです（各セルには「x / y」形式の数字があるため、最初にそれらをマイニングします）：

        $(document).ready(function(){
            $("#overview td").click(function(event){

                var content = $(this).html();
                var vals = content.split("/");
                var ratio = vals[0]/vals[1];
                alert(ratio);


                var red;
                var green;

                if(vals[1] == 0){
                    $(this).css('background-color', '#00FF00');
                } else{
                    if(ratio > 0.5){
                        red = 255;
                        green = parseInt(-2*255*ratio+(2*255));
                    } else{
                        green = 255;
                        red = parseInt(2*255*ratio);
                    }   
                    var rgbColor = 'rgb(' + red + ',' + green+ ', 0)';
                    var hexColor = rgb2hex(rgbColor);
                    $(this).css('background-color', hexColor);
                }
            });
        });

これで、個々のセルをクリックすると機能しますが、すべてのセルに色を付けたいと思い$(document).ready()ます。.each()メソッドは私が探しているものかもしれないと思いますが、適切に機能させる方法がわかりません...

どんな助けでも大歓迎です！

4

3 に答える 3

1

Jason P が述べたように、次のコードは正常に動作するはずです。

        $(document).ready(function () {
            $("#overview td").each(function () {

                var content = $(this).html();
                var vals = content.split("/");
                var ratio = vals[0] / vals[1];
                alert(ratio);


                var red;
                var green;

                if (vals[1] == 0) {
                    $(this).css('background-color', '#00FF00');
                } else {
                    if (ratio > 0.5) {
                        red = 255;
                        green = parseInt(-2 * 255 * ratio + (2 * 255));
                    } else {
                        green = 255;
                        red = parseInt(2 * 255 * ratio);
                    }
                    var rgbColor = 'rgb(' + red + ',' + green + ', 0)';
                    var hexColor = rgb2hex(rgbColor);
                    $(this).css('background-color', hexColor);
                }
            });
        });

.each メソッドは、取得したオブジェクトの単純な繰り返しです。

于 2013-09-24T21:41:25.683 に答える
1

Nunners に感謝します。コードを壊すヘッダー値がありました。次の if ブロックを使用して修正しました。

if(vals[1] == undefined){
    return true;
} else{
    //change colour
}
于 2013-09-24T22:03:58.433 に答える