JQuery的 - 谷歌字體選擇與字體大小，重量，風格

Question

我想定製我已經有了選擇谷歌字體和更新預覽DIV的功能之一，但是我也想添加「字體大小」，「字體重量「，」字母間距「等，但使用此功能只有當您點擊主字體選擇器combox框時，我希望它檢查其他選項，如字體重量，大小，字母間距，然後更新預覽，I嘗試爲每個元素個別添加Jquery代碼，但他們我無法獲得主選擇框的值ID ..有人可以幫助我做到這一點，或至少只有一個額外的選項，我已經添加了，所以對於其餘的我將自己..請看看這個小提琴，因爲我幾乎0當談到jquery ..

//init when value is changed 
jQuery('.google_font_select').change(function(){ 
    var mainID = jQuery(this).attr('id'); 
    GoogleFontSelect(this, mainID); 
}); 

http://jsfiddle.net/3eWmJ/

Answer 1

在你的這幾行代碼看看：

var _selected = $(slctr).val(); 
... 
$('.'+ _previewer).css('font-family', _selected +', sans-serif'); 

我們基本上要做的就是複製代碼，以改變文本的其他屬性。這些代碼行所做的是定義包含選項的HTML元素，並更改CSS屬性的值。基本上，我們只需要做同樣的事情，但其他屬性。

使用font-weight財產爲例，讓我們的變量分配到的字體重量的下拉菜單：

var font_weight = $('#gfont_weight').val(); 

然後我們使用該變量來獲取字體粗細，並分配它像這樣：

$('.'+ _previewer).css('font-weight', font_weight);