-5

私がしようとしているのは：

  1. 要素から RGB 値を取得する
  2. 16進数に変換します
  3. テキストフィールドに入れる

最初の解決策:

(このスレッドRGB to Hex および Hex to RGBから取得)

function rgbToHex(r, g, b) {
    return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}

#aN問題は、何を食べても戻ってこないことです。機能に欠陥がありますか、それとも何か間違っていますか?

ここでデモを見る

2番目の解決策:

上記と同じ投稿より。

function componentToHex(c) {
    var hex = c.toString(16);
    return hex.length == 1 ? "0" + hex : hex;
}

function rgbToHex(r, g, b) {
    return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}

これは、値を数値として渡すと機能しますrgbToHex(255,255,255)が、変数として数値を入力しようとすると何もしませんrgbToHex(rgbValue)。(デモの 19 ～ 25 行を参照)

デモはこちら

すべての助けに感謝します:)

4

1 に答える 1

1

これを試して：

function componentToHex(c) {
  var hex = c.toString(16);
  return hex.length == 1 ? "0" + hex : hex;
}

function rgbToHex(r, g, b) {
  return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}

//Slap the rel values into the fields
$('.color').click(function(e) {
  e.preventDefault();  

  var rgbVal = $(this).attr('rel');

  var rgbValSplit = rgbVal.split(",");

  for (var i = 0; i < 3; i++) {
    if (!rgbValSplit[i]) {
      rgbValSplit[i] = 0;
    }
  }

  var finalHex = rgbToHex(+rgbValSplit[0], +rgbValSplit[1], +rgbValSplit[2]);

  $('.color-picker-rgb').val(rgbVal);
  $('.color-picker-hex').val(finalHex);

  $('body').css('background', finalHex);
});

http://codepen.io/anon/pen/eiqbz

主な問題は、期待どおりに 3 つのパラメーターを渡す必要があることでした。もう 1 つの問題は、文字列ではなく数値を期待していたことです。したがって、「191」を渡すと、c.toString(16)単に と評価されますc。のような数値を渡すと191、適切な値に評価されます。

于 2013-03-28T19:08:41.213 に答える