Bagaimana untuk Menukar RGB ke Nilai Warna Hex dalam jQuery?

Mendapatkan Nilai Warna Hex daripada Warna RGB dalam jQuery

Masalah:

Dalam jQuery, kaedah css() memperoleh warna latar belakang elemen sebagai nilai Merah, Hijau dan Biru (RGB) dalam format rgb(r, g, b). Walau bagaimanapun, keperluan biasa adalah untuk mendapatkan nilai warna heks yang setara, seperti #FFFFFF.

Penyelesaian:

Kaedah tradisional untuk mencapai nilai hex daripada RGB melibatkan penukaran manual, yang boleh membosankan. Nasib baik, fungsi satu baris yang ringkas mencapai perkara ini:

const rgba2hex = (rgba) => `#${rgba.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+\.{0,1}\d*))?\)$/).slice(1).map((n, i) => (i === 3 ? Math.round(parseFloat(n) * 255) : parseFloat(n)).toString(16).padStart(2, '0').replace('NaN', '')).join('')}`

Fungsi ini menangani kedua-dua format RGB dan RGBA, memastikan kepelbagaian.

Contoh Penggunaan:

const element = $('#selector');
const rgbColor = element.css('backgroundColor');
const hexColor = rgba2hex(rgbColor);

Jawapan Kemas Kini untuk Moden Pelayar:

Sejak penyelesaian asal, sokongan penyemak imbas untuk ciri ECMAScript 2015 telah bertambah baik dengan ketara. Ini membolehkan penukaran RGB kepada heks yang lebih diperkemas dan ringkas:

const rgb2hex = (rgb) => `#${rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/).slice(1).map(n => parseInt(n, 10).toString(16).padStart(2, '0')).join('')}`

Fungsi ini menawarkan kefungsian yang serupa, khusus untuk format warna RGB.

Atas ialah kandungan terperinci Bagaimana untuk Menukar RGB ke Nilai Warna Hex dalam jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!