podświetlanie jquery () w dynamicznej tabeli
Mam mały problem z funkcją podświetlania, nad którą pracuję. Zasadniczo ładuję rekordy z bazy danych, która w określony sposób pasuje do bieżących danych formularza. Następnie, gdy ktoś wypełnia formularz, jeśli opisuje problem, który już istnieje w moim systemie, podświetli słowa, które ich opis ma wspólnego z istniejącymi rekordami. Moim problemem jest to, że stół się psuje. Będzie działał do pewnego stopnia, ale czasami przerywa część pętli PHP z reszty tabeli, a następnie nie ma formatowania, a funkcja podświetlania nie będzie działać. Aby być bardziej szczegółowym, po podziale znaczniki td w treści tabeli nie są zgodne z formatowaniem wiersza nagłówka. Warunki powodujące niepożądany efekt:
przechodzenie przez obszar tekstuJeśli trzeba usunąć lub zastosować zbyt wiele klas jednocześnie (poprzez usunięcie wszystkich, dodanie wielu słów lub usunięcie lub wyszukanie pojedynczego znaku z wieloma wystąpieniami)html na stronie głównej Skrypt && uruchamia podświetlenie
<textarea name="description" id="description"></textarea>
<script>
var delay = (function(){
var timer = 0;
return function(callback, ms){
clearTimeout (timer);
timer = setTimeout(callback, ms);
};
})();
$(function(){
$("#description").keydown(function(){
delay((function(){
$("#displayer *").removeClass('highlight');
var1 = $('textarea#description').val().split(' ');
for (var i=0;i<var1.length;i++){
$("#displayer *").highlight(var1[i], "highlight")};
}),1000);
});
});
</script>
zewnętrzny php budujący wyszukiwaną tabelę na podstawie wywołania ajax to:
echo '<TABLE BORDER="0" CELLSPACING="5" CELLPADDING="5" id="displayer"><FONT FACE="ARIAL">';
echo ' <tr> ';
echo ' <td width="20" ALIGN="LEFT" height="1">ID</td>';
echo ' <td width="89" ALIGN="LEFT" height="1">Date</td> ';
echo ' <td width="200" ALIGN="LEFT" height="1" >Description</td>';
echo ' <td width="89" ALIGN="LEFT" height="1" >Solution</td>';
echo ' <td width="20" ALIGN="LEFT" height="1" >User:</td>';
echo ' <td ALIGN="LEFT" height="1" >Key?:</td>';
echo ' <td ALIGN="LEFT" height="1" >Part:</td>';
echo ' <td ALIGN="LEFT" height="1" >Classified As:</td>';
echo ' </tr> ';
for ($i=1; $i <= $num_results; $i++)
{
$row = mysql_fetch_array($result1);
echo '<TR BGCOLOR="#EFEFEF">';
echo '<TD width="20">';
echo stripslashes($row['0']) ;
echo '</TD>';
echo '<TD width="89" >';
echo $row['1'] ;
echo '</TD>';
echo '<TD width="200">';
echo stripslashes($row['6']) ;
echo '</TD>';
echo '<TD width="89">';
echo stripslashes($row['11']) ;
echo '</TD>';
echo '<TD width="20">';
echo $row['5'] ;
echo '</TD>';
echo '<TD>';
if ($row['8'] == 1)
{echo 'Yes' ;}
else
{echo 'No' ;}
echo '</TD>';
echo '<td>'.$row['10'].'</td>';
echo '<td>'.$row['9'].'</td>';
echo '</TR>';
}
echo '</TABLE>';
zewnętrzna wtyczka do podświetlania:
jQuery.fn.highlight = function (str, className) {
var regex = new RegExp(str, "gi");
return this.each(function () {
$(this).contents().filter(function() {
return this.nodeType == 3 && regex.test(this.nodeValue);
}).replaceWith(function() {
return (this.nodeValue || "").replace(regex, function(match) {
return "<span class=\"" + className + "\">" + match + "</span>";
});
});
});
};
Myślę, że powinienem dodać test na pusty z jakąś ucieczką, aby rozwiązać pierwszy warunek, ale przy drugim nie jestem pewien, co się dzieje. Wszelkie sugestie są zdecydowanie mile widziane. Przepraszam, że post jest ogromny i zawiły, ale chciałem, żeby wszyscy mieli wszystkie informacje, które mogłem dostarczyć.