Ich habe ein kleines Problem mit einer Highlight-Funktion, an der ich arbeite. Grundsätzlich lade ich Datensätze aus einer Datenbank, die auf bestimmte Weise mit den aktuellen Formulardaten übereinstimmen. Wenn dann jemand das Formular ausfüllt und ein Problem beschreibt, das in meinem System bereits vorhanden ist, werden Wörter hervorgehoben, die die Beschreibung mit den vorhandenen Datensätzen gemeinsam hat. Mein Problem ist, dass der Tisch kaputt geht. Es wird bis zu einem gewissen Grad funktionieren, aber manchmal bricht es den PHP-Schleifenabschnitt aus dem Rest der Tabelle heraus, und es hat dann keine Formatierung und die Hervorhebungsfunktion wird nicht funktionieren. Um genauer zu sein, folgen die td-Tags im Hauptteil der Tabelle nicht mehr der Formatierung der Kopfzeile. Bedingungen, die den unerwünschten Effekt verursachen:

Tabulatur durch den TextbereichWenn zu viele Klassen gleichzeitig entfernt oder angewendet werden müssen (durch Löschen aller, Hinzufügen vieler Wörter oder Löschen oder Suchen eines einzelnen Zeichens mit vielen Vorkommen)

HTML auf der Hauptseite && Skript, um die Hervorhebung auszulösen

<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>

Das externe PHP, das die gesuchte Tabelle basierend auf einem Ajax-Aufruf erstellt, ist folgendes:

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>';

Externes Highlight Plugin:

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>";
            });
        });
    });
};

Ich denke, ich sollte einen Test für leer mit einer Art Flucht hinzufügen, um die erste Bedingung zu lösen, aber bei der zweiten bin ich mir nicht sicher, was passiert. Anregungen sind auf jeden Fall dankbar. Es tut mir leid, dass der Beitrag so umfangreich und verworren ist, aber ich wollte, dass jeder alle Informationen hat, die ich bereitstellen konnte.