W3.js HTML表滤波器 - ONKEYUP超时

Question

我是JavaScript的新手，需要以下问题的帮助：目前，我有PHP页面，其中我从.xml文件生成HTML表。它使用此PHP功能：

 function xmlToHtmlTable($p_oXmlRoot) {  
  $bIsHeaderProceessed = false;  
  $sTHead = '';  
  $sTBody = '';       
  foreach ($p_oXmlRoot as $oNode) {  
       $sTBody .= '<tr class=item>';  
       foreach ($oNode as $sName => $oValue){  
            if (!$bIsHeaderProceessed) {  
                 $sTHead .= "<th>{$sName}</th>";  
            }  
            $sValue = (string)$oValue;  
            $sTBody .= "<td>{$sValue}</td>";                 
       }  
       $bIsHeaderProceessed = true;  
       $sTBody .= '</tr>';  
  }  
  $sHTML = "<table id=demo border=1>  
                 <thead><tr>{$sTHead}</tr></thead>  
                 <tbody>{$sTBody}</tbody>  
            </table>";  
  return $sHTML;  

生成的表非常长，我需要过滤选项。我找到了使用W3.JS过滤器表功能符合我需求的简单解决方案。我有一个进行过滤的输入字段：

<input onkeyup="w3.filterHTML('#demo', '.item', this.value)" placeholder="Filter">

一切正常，但非常慢，表长 2000行，搜索正在处理每个字符打字并刷新结果。我需要的是执行键入单词/数字/...在说2秒之后

我在这里找到了类似的问题，但是我无法与W3.J一起使用(也许做错了什么，就像我说的是从JS开始(。

Answer 1

在Angularjs中，有一个称为ng-minlength =" 2" ..的概念，这意味着只有在搜索字符串为2个字符之后才能执行搜索。所以我在JavaScript中做了。而不是直接调用W3 JS过滤器功能，只能在搜索字符串长度大于2之后调用。希望这会有所帮助。

    <p>
    <!--<input oninput="w3.filterHTML('#id01', '.item', this.value)" placeholder="Search for names..">-->
    <input oninput="searchFilter(this.value)" placeholder="Search for names..">
    </p>
        <script>
        function searchFilter(v) {
            var n = v.length;
            if(n>2) {
                w3.filterHTML('#id01', '.item', v);
            }
            else {
                w3.filterHTML('#id01', '.item', '');
            }
        }
    </script>