0

cssHooks を使用してこの関数を使用して、背景色の RGB カラーを HEX 値に変換します。私の質問はこれです。境界線の色とテキストの色もやりたいです。3 つの個別の機能を作成する必要がありますか?それとも組み合わせることはできますか?

編集：ここに3つの機能があります。コードをきれいにするために、3つすべてを1つにまとめようとするのに苦労しています。3つすべてを1つのフックに結合するにはどうすればよいですか?

$.cssHooks.backgroundColor = {
get: function(elem) {
    if (elem.currentStyle)
        var bg = elem.currentStyle["background-color"];
    else if (window.getComputedStyle)
        var bg = document.defaultView.getComputedStyle(elem,
            null).getPropertyValue("background-color");
    if (bg.search("rgb") == -1)
        return bg;
    else {
        bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
        function hex(x) {
            return ("0" + parseInt(x).toString(16)).slice(-2);
        }
        return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]);
    }
}
}

$.cssHooks.borderColor = {
get: function(elem) {
    if (elem.currentStyle)
        var bg = elem.currentStyle["border-color"];
    else if (window.getComputedStyle)
        var bg = document.defaultView.getComputedStyle(elem,
            null).getPropertyValue("border-color");
    if (bg.search("rgb") == -1)
        return bg;
    else {
        bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
        function hex(x) {
            return ("0" + parseInt(x).toString(16)).slice(-2);
        }
        return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]);
    }
}
}

$.cssHooks.color = {
get: function(elem) {
    if (elem.currentStyle)
        var bg = elem.currentStyle["color"];
    else if (window.getComputedStyle)
        var bg = document.defaultView.getComputedStyle(elem,
            null).getPropertyValue("color");
    if (bg.search("rgb") == -1)
        return bg;
    else {
        bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
        function hex(x) {
            return ("0" + parseInt(x).toString(16)).slice(-2);
        }
        return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]);
    }
}
}
4

2 に答える 2

0

これにより、個々の CSS セレクターだけでなく、すべての値の入力が変更されます...

$.cssHooks.colorz = {
get: function(elem, rule) {
if (elem.currentStyle)
    var bg = elem.currentStyle[rule];
else if (window.getComputedStyle)
    var bg = document.defaultView.getComputedStyle(elem,
        null).getPropertyValue(rule);
if (bg.search("rgb") == -1)
    return bg;
else {
    bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
    function hex(x) {
        return ("0" + parseInt(x).toString(16)).slice(-2);
    }
    return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]);
}
}
}
于 2013-03-06T20:27:36.393 に答える
0

次のように実行できます。

    function _register_jquery_get_hex_color(newname,styleattr) {
    $.cssHooks[newname] = {
        get: function(elem) {
            if (elem.currentStyle)
                var bg = elem.currentStyle[styleattr];
            else if (window.getComputedStyle)
                var bg = document.defaultView.getComputedStyle(elem,
                    null).getPropertyValue(styleattr);
            if (bg.search("rgb") == -1)
                return bg;
            else {
                bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
                function hex(x) {
                    return ("0" + parseInt(x).toString(16)).slice(-2);
                }
                return hex(bg[1]) + hex(bg[2]) + hex(bg[3]);
            }
        }
    }
}
_register_jquery_get_hex_color("backgroundColor","background-color");
_register_jquery_get_hex_color("borderColor","border-color");
_register_jquery_get_hex_color("color","color");
于 2014-09-29T17:32:44.970 に答える