我只需要在另一個 div 中顯示 textarea 值作為實時預覽。
克隆 textarea 值并附加到另一個 div
需要實作兩件事，但第一件事是部分實作的
- 鍵入回車鍵時，然后在文本之間添加 br 標簽（完成）
- 鍵入空格鍵時，然后在文本之間添加空格（如果多次鍵入空格鍵，它現在只顯示一個空格）
提琴手
$('textarea').keyup(function(e){
//console.log(e)
let content = e.target.value.replace(/\r\n|\r|\n/g, "<br />")
$('.content').html(content);
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea name="" id="" cols="30" rows="10"></textarea>
<div class="content">
Live textarea content here
</div>uj5u.com熱心網友回復：
您可以使用 replaceAll() 來替換空格：
$('textarea').keyup(function(e){
let content = e.target.value.replaceAll(" ", " ").replace(/\r\n|\r|\n/g, "<br />")
$('.content').html(content);
});
uj5u.com熱心網友回復：
只需將您的div標簽替換為pre標簽即可。你replace也不需要使用函式。
uj5u.com熱心網友回復：
只需添加pre標簽以保留空間。
$('textarea').keyup(function(e){
//console.log(e)
let content = e.target.value.replace(/\r\n|\r|\n/g, "<br />")
$('.content').html("<pre>" content "</pre>");
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea name="" id="" cols="30" rows="10"></textarea>
<pre>
<div class="content">
Live textarea content here
</div>
</pre>轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/378794.html
標籤：javascript html 查询