按下特定键时如何将 html 标签附加到文本区域？

Question

我正在尝试向 textarea 添加一个功能，当按下 Enter 时，它将向 textarea 的 innerHTML 添加 <br> 标签。

这是我的 codepen.

我已经用 texareaElement.val(); 试过了，但它直接添加到文本区域，但用户不应该看到它。应该在后台。

function textAreaNewLine(element, event) {
  // 13 is the keycode for "enter" 
  if (event.keyCode == 13) {
    var elVal = element.val();
    element.val(elVal + '<br>');
  }
}

$('#ta').on('keypress', function(event) {
  var el = $(this);
  textAreaNewLine(el, event);
  $('.main').html($('#ta').val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea rows="4" cols="50" id="ta"></textarea>
<div class="main"></div>

Answer 1

如果我理解正确你的问题，你可以添加一个空行，如：引入另一个变量 var emptyLine = "\n"; 然后将其附加到值。

勾选下面的fiddle

function textAreaNewLine(element, event) {
  // 13 is the keycode for "enter" 
  if (event.keyCode == 13) {
    var elVal = element.val();
    var emptyLine = "\n";

    element.val(elVal + emptyLine );
  }
}

$('#ta').on('keypress', function(event) {
  var el = $(this);
  textAreaNewLine(el, event);
  $('.main').html($('#ta').val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea rows="4" cols="50" id="ta"></textarea>
<div class="main"></div>

按下特定键时如何将 html 标签附加到文本区域？

How to append html tag to textarea when press spesific key?

html

javascript

textarea