JavaScript 从 1 个文本区域实时更新到多个文本区域

javascript real-time update from 1 text area to multiple textarea

本文关键字：区域 文本 实时更新 JavaScript      更新时间：2023-09-26

我想要 1 个主文本区域，您可以在其中键入任何内容，它将实时更新多个文本区域，以不同字体显示键入的字母。

例：正文区：

<textarea id="textField0" autocomplete="off" style="font-family:'Alex Brush';" 
onkeyup="javascript:setFontText(this.value);" rows="2" name="textField0"></textarea>

多个文本区域：

<textarea id="Courier new" class="fontTextArea2" style="font-family:courier_newregular;" 
autocomplete="off" name="Courier new"></textarea>
<textarea id="Arial Black" class="fontTextArea2" style="font-family:arialblack; " 
autocomplete="off" name="Arial Black"></textarea>

我如何为 setFontText（） 编写 javascript？

谢谢！

你可以做这样的事情：

function setFontText(text) {
   document.getElementById("Courier_new").innerHTML = text;
   document.getElementById("Arial_Black").innerHTML = text;
}

我还建议您将id更改为不包含空格的内容。

示例：http://jsfiddle.net/3Lq0ykyk/1/

我把事件处理程序从内联带到了javascript，只需在css中制作你想要的字体

var areatwo=document.getElementById('two');
var areathree=document.getElementById('three');
 
  
    document.addEventListener('keydown',setFontText);
document.addEventListener('keyup',setFontText);
      
      function setFontText(){ 
            var textareavalue=document.getElementById('one').value;
                areatwo.value=textareavalue;
                  areathree.value=textareavalue;
      
  }
#two{font-family:courier_newregular;}
#three{font-family:arialblack; }
<textarea id="one"></textarea>
<textarea id="two"></textarea>
<textarea id="three"></textarea>

相关文章：