2016-12-07 6 views
0

私は、ここでstackoverflowの "質問質問"ページで使用するものに似たテキストエリアとdivを作成したいと思います。 テキストエリアにテキストを入力すると、テキストエリアの下にテキストが表示されます。 私は "a024"のようないくつかのコードをテキストエリアに入力してdivのシンボルに "ライブ"変換するようにしたいと思っています。 この機能を利用するにはjavascriptを使用する必要がありますか?おかげさまで テキストエリアのテキストのライブレンダリング

+0

ああ、あなたは4つのスペースはこのように...コードになって意味ですか? – Mahi

答えて

0

はい。これは、JavaScriptの初めにダイナミックHTML用にDHTMLと呼ばれていました。 この動作を作成するには、JavaScriptを使用する必要があります。

次のようなものを持つ要素の値を取得することができます

var source = document.getElementById("sourceTextarea").value; 

とのようなもので、宛先要素内のテキストを設定します。あなたが使用する必要がありますあなたのHTMLで

document.getElementById("destinationDiv").innerText = "some text"; 

<textarea id="sourceTextarea"></textarea><div id="destinationDiv"></div> 
0

この目標を達成するためには、間違いなくJavascriptが必要です。

テキストエリアの 'onkeyup'プロパティを使用して、javascript関数のkeyupイベントをバインドできます。

これを実行すると、必要なものを置き換えるためにtexareaの値を処理できます。

function updateMyDiv() { 
 
    var myTextarea = document.getElementById("myTextarea"); 
 
    var myDiv = document.getElementById("myDiv"); 
 
    myDiv.innerHTML = myTextarea.value; 
 
}
<html> 
 
<body> 
 

 
<textarea id="myTextarea" onkeyup="updateMyDiv()"> 
 
</textarea> 
 

 
<div id="myDiv"> 
 
</div> 
 

 
</body> 
 
</html>

関連する問題