行の単語の最初の文字を強調表示していません

Question

Hereは、検索がうまくいきますが、名前列のテキストの最初の文字をハイライト表示せずに残りの一致する文字を強調表示しています... ....そして誰でもそれを修正することができます....... たとえば、検索バーに「v」と入力すると、すべてのvが表示されますが、名前列には「v」が表示されません.....名前欄のテキストの最初の文字ごとにマッチした要素が

を強調している私たちは、このコードに変更する必要は除く......

$("#search").keyup(function(){ 
 
     _this = $(this); 
 
     var searched_term = $(_this).val().toLowerCase(); 
 
\t \t if(_this.val() == ""){ 
 
\t \t \t $.each($("#ftz-table tbody tr td:nth-child(n+2)"), function() { 
 
\t \t \t $(this).text($(this).text()); \t 
 
\t \t }) 
 
\t \t return; 
 
\t \t } 
 
     $.each($("#ftz-table tbody tr td:nth-child(n+2)"), function() { 
 
\t \t \t var original_text = $(this).text();  
 
\t \t \t if(!($(this).text().toLowerCase().indexOf(searched_term) == -1)){ 
 
\t \t \t \t $(this).html(original_text.replace(searched_term, "<mark>"+searched_term+"</mark>")); 
 
\t \t \t } \t 
 
\t \t \t else{ 
 
\t \t \t \t $(this).text($(this).text()); \t 
 
\t \t \t } 
 
     }); 
 
    });

Answer 1

あなたの検索では大文字と小文字を区別しませんが、original_text.replace()はないので、indexOfがvまたはVしかしreplaceのみ検索入力の場合と一致するものを置き換える見つけます。

あなたがキャプチャ必要な場合維持するために：

var re = new RegExp("(" + searched_term + ")", "i"); 
$.each($("#ftz-table tbody tr td:nth-child(n+2)"), function() { 
    $(this).html($(this).text().replace(re, "<mark>$1</mark>")); 
}); 

https://jsfiddle.net/xr0hns13/1/

を（searched_termは任意の正規表現に予約文字のためにエスケープする必要があります）