I am using the below search function in my table. I need to highlight any results matching with the keywords in the search input in the table. I am not sure how to add the scripting in. Kindly assist me on this as I am very new to Jscripting and still learning.

window.tableSearch = {};

tableSearch.init = function () {
  this.Rows = document.getElementById('data').getElementsByTagName('TR');
  this.RowsLength = tableSearch.Rows.length;
  this.RowsText = [];
  for (var i = 0; i < tableSearch.RowsLength; i++) {
    this.RowsText[i] = (tableSearch.Rows[i].innerText) ? tableSearch.Rows[i].innerText.toUpperCase() : tableSearch.Rows[i].textContent.toUpperCase();
  }
}

tableSearch.runSearch = function () {
  this.Term = document.getElementById('textBoxSearch').value.toUpperCase();
  for (var i = 0, row; row = this.Rows[i], rowText = this.RowsText[i]; i++) {
    row.style.display = ((rowText.indexOf(this.Term) != -1) || this.Term === '') ? '' : 'none';
  }
}

tableSearch.search = function (e) {
  var keycode;
  if (window.event) {
    keycode = window.event.keyCode;
  } else if (e) {
    keycode = e.which;
  } else {
    return false;
  }
  if (keycode == 13) {
    tableSearch.runSearch();
  } else {
    return false;
  }
}
有帮助吗?

解决方案

They people in this thread used a jQuery pluging to highlight the search string.

var words = "keyword1,keyword2,keyword3";
var keywords = words.split(',');
for(var i = 0; i < keywords.length; i++) {
    $(selector).highlight($.trim(keywords[i]));
}

Is that something you could implement in your code as well?

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top