Question

我有两个文本区域，我将它们绑在一起。当您在第一个文本区域中书写时，我想在第二个文本区域中创建自动主题标签。

如何在文本区域中的单词开头加上＃号？

function countChar(val) {
  var len = val.value.length;
  if (len > 35) {
    val.value = val.value.substring(0, 35);
  } else {
    $('#charNum').text(35 - len + ' chars left');
  }
  var txtVal = $('#' + val.id).val();
  var number = 0;
  var matches = $(val).val().match(/\b/g);
  if (matches) {
    number = matches.length / 2;
  }
  var count = $('#cc');
  $(count).text(number + ' word' + (number != 1 ? 's' : '') + ' approx ');

  $('#' + val.id + 'keys').val(txtVal);

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span id="charNum"></span>
<textarea class="form-control" rows="3" data-validation="length" onkeyup="countChar(this)" data-validation-length="max35" name="post" id="message1" maxlength="35"></textarea>
<span id="charNumm"></span>
<textarea class="form-control" rows="3" data-validation="length" onkeyup="countCharr(this)" data-validation-length="max42" name="keys" id="message1keys" maxlength="42"></textarea>

Answer 1

要在值字符串中的所有单词前加上#字符，可以使用正则表达式。

话虽这么说，您还可以进行其他一些改进，例如使用DOM遍历将文本区域关联在一起，而不是在id值周围乱砍，使用不引人注目的事件处理程序，并使用input事件以捕获对字段的所有更改。试试这个：

$('.message').on('input', function(e) {
  var maxLength = 35;
  var $keys = $(this).closest('.message-container').find('.keys');

  var len = this.value.length;
  if (len > maxLength) {
    this.value = this.value.substring(0, maxLength);
  } else {
    $('#charNum').text(maxLength - len + ' chars left');
  }
  
  var keyText = this.value.replace(/(^|\s+)/g, "$1#");
  $keys.val(keyText);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="message-container">
  <span id="charNum"></span>
  <textarea class="message form-control" rows="3" data-validation="length" data-validation-length="max35" name="post" maxlength="35"></textarea>
  
  <textarea class="keys form-control" rows="3" data-validation="length" data-validation-length="max42" name="keys" maxlength="42"></textarea>
</div>

如何在文本区域中单词的开头加上＃号？

1 个答案: