Javascript 更改 textarea 字段中的字体和字体大小

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4490410/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 12:37:14  来源:igfitidea点击:

Changing the Font and font Size in a textarea field

javascripthtmlcss

提问by Squarefinger

Using the following code sample:

使用以下代码示例:

<html>
<body>

<script language = "Javascript">

maxL=240;
var bName = navigator.appName;
function taLimit(taObj) {
 if (taObj.value.length==maxL) return false;
 return true;
}

function taCount(taObj,Cnt) { 
 objCnt=createObject(Cnt);
 objVal=taObj.value;
 if (objVal.length>maxL) objVal=objVal.substring(0,maxL);
 if (objCnt) {
  if(bName == "Netscape"){ 
   objCnt.textContent=maxL-objVal.length;}
  else{objCnt.innerText=maxL-objVal.length;}
 }
 return true;
}
function createObject(objId) {
 if (document.getElementById) return document.getElementById(objId);
 else if (document.layers) return eval("document." + objId);
 else if (document.all) return eval("document.all." + objId);
 else return eval("document." + objId);
}
</script>
<font face="Arial" font size="2">
Maximum Number of characters for this text box is 240.</font><br>

<textarea onKeyPress="return taLimit(this)" onKeyUp="return taCount(this,'myCounter')" name="Message" rows=6 wrap="physical" cols=42>
</textarea>
<br>
<font face="Arial" font size="2">
You have <B><SPAN id=myCounter>240</SPAN></B> characters remaining 
for your message</font>

</body>
</html>

How do I change the font and font size in the textarea?

如何更改 textarea 中的字体和字体大小?

回答by Donut

Use CSSto define a style for the textareaelement. For example:

使用CSS定义textarea元素的样式。例如:

textarea {
   font-size: 20pt;
   font-family: Arial;
} 

Note that there are three waysto add CSS to your website -- you can use an external stylesheet, an internal stylesheet, or inline styles (or a combination thereof).

请注意,可以通过三种方式将 CSS 添加到您的网站——您可以使用外部样式表、内部样式表或内联样式(或它们的组合)。

Using an internal stylesheet might look like this:

使用内部样式表可能如下所示:

<head>
<style type="text/css">
textarea {
   font-size: 20pt;
   font-family: Arial;
} 
</style>
</head>

<!-- rest of your code goes here... -->

See herefor more information on styling textarea.

有关样式的更多信息,请参见此处textarea

回答by SicLeaf

I know this is really old, but I am sure someone could use this information:

我知道这真的很旧,但我相信有人可以使用这些信息:

use Iframe and initialize it to run when the page is loaded and hide textarea...this helps if you want to make a WYSIWYG editor.

使用 iframe 并初始化它以在页面加载时运行并隐藏 textarea...如果您想制作 WYSIWYG 编辑器,这会有所帮助。

html page: onLoad="iFrame()"

html 页面:onLoad="iFrame()"

js page: function iFrame(){ name.document.designMode = 'on'; name.document.execCommand('fontName',false,"verdana");

js 页面:function iFrame(){ name.document.designMode = 'on'; name.document.execCommand('fontName',false,"verdana");

}

}