Rumah > hujung hadapan web > tutorial js > kaedah jQuery untuk mendapatkan nilai warna dalam style_jquery

kaedah jQuery untuk mendapatkan nilai warna dalam style_jquery

WBOY
Lepaskan: 2016-05-16 16:17:15
asal
1037 orang telah melayarinya

Contoh dalam artikel ini menerangkan cara jQuery memperoleh nilai warna dalam gaya. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Apabila saya menggunakan jQuery untuk mendapatkan nilai warna latar belakang dalam gaya hari ini, saya mendapati bahawa nilai warna yang diperoleh adalah dalam format yang berbeza dalam IE berbanding dalam Chrome dan Firefox Dalam IE, ia dipaparkan dalam format HEX [. #ffff00], manakala dalam Chrome , Firefox memaparkan [rgb(255,0,0)] dalam format GRB Memandangkan nilai warna perlu disimpan dalam pangkalan data, kami ingin menyatukan format nilai warna. (sebenarnya, mereka boleh disimpan jika mereka tidak bersatu). Selepas mencari, saya mendapat sekeping kod daripada tapak web asing:

$.fn.getHexBackgroundColor = function() {
 var rgb = $(this).css('background-color');
 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
 function hex(x) {return ("0" + parseInt(x).toString(16)).slice(-2);}
 return rgb= "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}
Salin selepas log masuk

Takrifan di atas ialah fungsi jQuery Kita boleh mendapatkan nilai RGB warna latar belakang tag id="bg" melalui $("#bg").getHexBackgroundColor();.

Mari buat sedikit pengubahsuaian, iaitu, tambah pertimbangan Jika ia adalah penyemak imbas IE, dapatkan nilainya secara langsung Jika ia adalah penyemak imbas bukan IE, tukarkan nilai ke dalam format RGB:

$.fn.getHexBackgroundColor = function() {
 var rgb = $(this).css('background-color');
 if(!$.browser.msie){
  rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
  function hex(x) {return ("0" + parseInt(x).toString(16)).slice(-2);}
  rgb= "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
 }
 return rgb;
}
Salin selepas log masuk

Saya harap artikel ini akan membantu pengaturcaraan jQuery semua orang.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan