jQuery更改字体系列和字体大小

我试图通过从列表中选择字体来更改textarea和容器中出现的文本的字体系列和字体大小，字体大小应该是固定的。 我也在尝试在拾取字体时更改背景颜色。

那是我的代码：

 function changeFont(_name) { document.body.style.fontFamily = _name; document.textarea = _name; }    
  erase  Arial Verdana Impact MS Comic Sans  
  Textarea  
 
 
This is a container
 
   

当我在浏览器中尝试它时，字体系列不会在文本区域中更改。 它只会在容器中发生变化。 我现在也知道如何在选择字体系列时为容器和textarea设置新的字体大小和背景。

我将不胜感激任何帮助！

Answer 1

全面解决方案：

HTML：

 
 erase  Arial Verdana  Impact  Comic Sans MS   7 10 20 30  
 
 Text into textarea 
 
 
 Text into container 
 
  

jQuery的：

 $("#fs").change(function() { //alert($(this).val()); $('.changeMe').css("font-family", $(this).val()); }); $("#size").change(function() { $('.changeMe').css("font-size", $(this).val() + "px"); }); 

在这里小提琴： http ： //jsfiddle.net/AaT9b/

Answer 2

在我看来，只需在主体上设置一个类并根据该类在css中设置font-family，这将是一个更简洁的解决方案。
不知道在你的情况下这是否是一个选项。

Answer 3

在某些浏览器中，字体是为textareas和输入设置的，因此它们不会从较高元素inheritance字体。 所以，我认为你需要为每个textarea应用字体样式并在文档中输入（不仅仅是正文）。

一个想法可能是在主体上添加clases，然后使用CSS来相应地设置文档的样式。

Answer 4

如果您只想更改TEXTAREA中的字体，则只需将原始代码中的changeFont（）函数更改为：

 function changeFont(_name) { document.getElementById("mytextarea").style.fontFamily = _name; } 

然后选择字体将仅在TEXTAREA中更改字体。