#javascript #html-table
Вопрос:
У меня есть этот javascript, который ищет все поля в таблице html для ввода текста, затем отображает строки, которые соответствуют, и скрывает те, которые не соответствуют. Я хочу дополнительно выделить строку поиска в отображаемых строках. Как это сделать простым способом, изменив этот скрипт :
<script>
function myFunction(){
// Declare variables
var input, filter, table, tr, td, i;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("myTable");
tr = table.getElementsByTagName("tr");
// Loop through all table rows, and hide those who do not match the search query
for (i = 1; i < tr.length; i ) {
td = tr[i].getElementsByTagName("td") ;
for(j=0 ; j<td.length ; j )
{
var tdata = td[j] ;
if (tdata) {
if (tdata.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
break ;
} else {
tr[i].style.display = "none";
}
}
}
}
}
</script>
Кроме того, вот пример файла таблицы html с этим javascript, встроенным сверху : https://sourceforge.net/projects/my-project-files/files/marks.html/download
Пожалуйста, помогите мне с переработанным и протестированным сценарием. Я новичок в javascript. Спасибо.
Комментарии:
1. Используйте найденный индекс, найдите конечный индекс фильтра и используйте его для вставки
mark
тега вокруг фильтра. Вы также можете использовать регулярное выражение, созданное на основе значения фильтра, и использоватьString.prototype.replace
его во внутреннем html-файле для обертывания фильтраmark
.