突出显示文本区域中的文本，来自 DataTable 上的移动

Question

我有一个显示搜索字符串列的 JQuery 数据表。当用户将鼠标悬停在该行上时，我想突出显示文本区域内的相应文本。

例如，如果文本区域包含以下内容：

这是一个美丽的地方

我的 Datatable 行包含：

这是一个地方

那么需要突出显示文本区域部分。

我使用了几个插件，但它们似乎只适合单个单词匹配，而我需要进行句子搜索，如果你愿意的话。

我的代码是：

  $('#tblHitData tbody').on('mouseover', 'td', function() {

        var data = oHitData.row($(this).parents('tr')).data();

        var searchString = data['SearchString'];

        if ($("#message:contains('" + searchString + "')")) {
            $('#message').highlight(searchString);
        };

  });

Answer 1

这会返回一个 jQuery 对象：

$("#message:contains('" + searchString + "')")

JavaScript 中的对象始终是“真实的”，因此您的 if 语句将始终运行。

相反，您可以在选择器本身上使用each 函数。

更新

您不能在文本区域上使用:contains。相反，您可以使用 indexOf() 在 textarea 的 val() 中搜索字符串。

var searchString= 'is a test';

$("div:contains('" + searchString + "')").each(function() {
  $(this).css('background', 'yellow');
});

if($('#message').val().indexOf(searchString) >- 1) {
  $('#message').css('background', 'yellow');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>this is a test</div>
<div>this might possibly be a test</div>
<div>let's give lois a test</div>
<div>this is most definitely a test</div>
<textarea id="message">
  this is a test
</textarea>