jQueryでrgb(255,255,255)を#FFFFFF形式に変換

ちょっと仕事で使ったのでメモ。
jQueryで色を指定したり取得したりすると、rgb(xxx,xxx,xxx)の形式になる。
特定の要素の色を取得して、フォームのvalueとして登録したかったので調べた。

.color{
    display:inline-block;
    width:1em;
    height:1em;
    padding:0;
    border: 2px solid #CCC;
    margin-right:6px;
}

.color_000{
    background-color: #000;
}
.color_333{
    background-color: #333;
}
.color_666{
    background-color: #666;
}
.color_999{
    background-color: #999;
}
.color_ccc{
    background-color: #CCC;
}
.color_fff{
    background-color: #FFF;
}

こんなCSSで、

<p>
    <a href="#" class="color_000 color"></a>
    <a href="#" class="color_333 color"></a>
    <a href="#" class="color_666 color"></a>
    <a href="#" class="color_999 color"></a>
    <a href="#" class="color_ccc color"></a>
    <a href="#" class="color_fff color"></a>
    <input type="hidden" value="" name="selected_color" class="selected_color" />
</p>

なHTMLの場合、

jQuery(function(){
    $(".color").click(function(){
        $(".color").css({"borderColor":"#CCC"});
        $(this).css({"borderColor":"blue"});

        //クリックされた要素の背景色取得
        var bgColor = $(this).css("backgroundColor").toString();
        //背景色の余計な文字列削除
        bgColor = bgColor.replace("rgb(","");
        bgColor = bgColor.replace(")","");
        //文字列分割
        bgColor = bgColor.split(",");
        //10進数を16進数に変換して連結
        bgColor = "#"+parseInt(bgColor[0]).toString(16)+parseInt(bgColor[1]).toString(16)+parseInt(bgColor[2]).toString(16);
        //inputに値を設定
        $(this).nextAll("input[type=hidden]").val(bgColor);
    });
});

ミソはココ

parseInt(bgColor[0]).toString(16);

parseInt()で文字列（例えば255）を数値に変換。それをtoString(16)で文字列に変換している。「(16)」は16進数に変換って意味。

toString(16)なんて初めて知った...