javascript - 对 Textarea 的内容使用 .match()

Question

我进行了一些搜索，发现了一些与我类似的问题，但我希望找到一个解决方案来纠正我预先存在的代码。

如果您想查看整个内容，请使用以下代码笔:http://codepen.io/JTBennett/pen/ygyZwE

$('#ST_txt_write').keyup(function(){
var childText = $('#ST_cmp_body').text();
var count = (childText.match(/hi/g) || []).length;
$('#ST_KW').html(count);
});

问题是我无法让匹配函数与文本区域一起使用，因此用户可以在框中输入他们想要的任何内容，这将是代码寻求匹配的内容。我尝试创建一个返回框的文本内容的变量(就像您在那里看到的 childText var 一样)，但这只会匹配一次并完成而不是计数。

任何正确方向的帮助将不胜感激。抱歉，我不太擅长 jQuery 或任何与此相关的事情。

Answer 1

您在问题中给出的示例与您的代码笔有重要区别。在您的问题中，您有一个正则表达式文字，您将其传递到 .match() 中，并且在您的 codepen 中，您将一个字符串传递到 .match() 中。 您需要做的是使用 new RegExp() 创建一个新的正则表达式，并将全局标志传递给它。

代码如下所示:

$('#ST_txt_write').keyup(function(){
  var childText = $('#ST_cmp_body').val();
  var KW = $('#ST_KW_txt').val();
  var regex = new RegExp(KW, 'g'); // <--- This creates a regex from the string in KW
  var count = (childText.match(regex) || []).length; // <-- Use regex here instead of string
  $('#ST_KW').html(count);
});

这是一个工作示例:

$(function() {
  $('#ST_txt_write').keyup(function() {
    var childText = $('#ST_cmp_body').val();
    var KW = $('#ST_KW_txt').val();
    var regex = new RegExp(KW, 'g');
    var count = (childText.match(regex) || []).length;
    $('#ST_KW').text(count);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="ST_txt_write">
  <textarea id="ST_cmp_body" style="height: 200px; width: 300px;"></textarea>
</div>
<div>
  Keywords:
  <input type="text" id="ST_KW_txt" />
</div>
<div>
  # of Keywords Found: <span id="ST_KW"></span>
</div>