Question

有人可以帮我制作这个脚本。

我有2个文本框输入和输出，以及fontsize SELECT - OPTION标签，我想让它以这样的方式工作：如果我选择任何选项，textareas中的fontsize将实时更改。

thnks

＆＃13;

function myFunction() {
{
  var inputField = document.getElementById('input');
  var outputField = document.getElementById('output');
  var x = document.getElementById("textareafontsize").value;
  document.write("txt.fontsize(3)");
  document.write("txt.fontsize(5)");
  document.write("txt.fontsize(8)");
  document.write("txt.fontsize(10)");
  document.write("txt.fontsize(12)");
  document.write("txt.fontsize(14)");
  document.write("txt.fontsize(15)");
  document.write("txt.fontsize(18)");
  document.write("txt.fontsize(20)");
  document.write("txt.fontsize(24)");
  document.write("txt.fontsize(30)");
}

＆＃13;

<!DOCTYPE html>
<html>
<body>

<p>Textarea Font Size.</p>

<textarea name="input" id="input" cols="75" rows="10">Hello world</textarea> 
<textarea name="output" id="output" cols="75" rows="10">Hello world</textarea> 
<br>
<select name="textareafontsize" id="textareafontsize" title="Textarea Font Size">
<option value="3" >3</option>
<option value="5" >5</option>
<option value="8" >8</option>
<option value="10" >10</option>
<option value="12" >12</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="18" >18</option>
<option value="20" >20</option>
<option value="24" >24</option>
<option value="30" >30</option>
</select>

</body>
</html>

＆＃13;

Answer 1

您必须为change的{{1}}事件设置偶数处理程序，以便您可以执行代码以在正确的时间更改字体。

然后，您所要做的就是将两个select元素textarea设置为style.fontSize的{{1}}。但你需要记住连接测量单位（我假设你想要点数）。

您也不需要在每个value中指定select。如果未指定value=Nn，则option默认为value的内容。

备注：

你的函数内部有一个额外的value，这是一种语法错误。

option仅在创建全新内容时有用动态的Windows /文档，你不是在这里做的请勿使用{。

document.write()表示您有一个名为的对象引用 document.write()设置（你没有）并且你要调用它该对象的txt.fontsize(3)方法并将其传递给txt。最后一点语法是完全错误的。

fontsize

3

var inputField = document.getElementById('input'); var outputField = document.getElementById('output'); document.getElementById("textareafontsize").addEventListener("change", function(){ // Elements have a "style" property, which returns an object that exposes all the CSS properties // as properties of that object. CSS names with a hyphen get converted to no hypen, but camelCase. inputField.style.fontSize = this.value + "pt"; outputField.style.fontSize = this.value + "pt"; });

OPTION标签 - 更改textarea字段中的字体大小

1 个答案: