javascript - 如何在输入标签中使用javascript显示实时输入？

Question

如何通过用 input 标签替换 textarea 标签来运行此脚本？我在页面中使用了输入标签并想添加此代码，但此代码使用了文本区域。如果我更改文本区域来输入代码则不起作用。

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

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

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

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

Answer 1

试试这个:-

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

或者，使用 document.getElementsByClassName

方法 .getElementsByClassName() 返回一个类似数组的元素对象。因此您必须访问第一个元素(如果有)。

var elements = document.getElementsByClassName("anyclass);
var value = elements[0].value;

alert(value); // 1

或者，您还可以使用 .querySelector() 方法:

var value = document.querySelector('.anyclass').value;
alert(value); // 1