显示隐藏动态添加的表行

时间:2013-08-06 13:20:39

标签: javascript jquery

我在桌子上实现了搜索,它运行正常。但是在更新表行后有一个问题。搜索始终显示已编辑的行,即使它与搜索不匹配。

例如。脚步 - 1.在搜索框中输入“user3”,然后输入结果 - user3 2.edit“user3” 3.在搜索框中输入“user1”,然后输入结果 - user1,user3

HTML

<table>
<tbody id="list">
<tr id="o1">
    <td class="txtclass">user</td>
    <td><a>edit</a></td>        
</tr>

<tr id="o2">
    <td class="txtclass">user2</td>
    <td><a>edit</a></td>  
</tr>

<tr id="o3">
    <td class="txtclass">user3</td>
    <td><a>edit</a></td>  
</tr>

<tr id="o4">
    <td class="txtclass">user4</td>
    <td><a>edit</a></td>  
</tr>
</tbody>
</table>

脚本

// function to replace table row
// d- table row html 
function updateRow(d) 
{ 
   $("#o3").before(d).remove(); 
}

//在表格行列表中搜索<​​/ p>

$("#textsearch").change(function () {
        var filter = $(this).val().toLowerCase();
        var li;
        list = list of table rows;
        len = list.length;        
        for (var i = 0; i < len; i++) {
            li = list[i];
            txt = $(li).find(".txtclass").text();            
            if ((txt || "").toLowerCase().indexOf(filter) >= 0) {
                if (li.style.display == "none") { li.style.display = "block"; }
            } else {
                if (li.style.display != "none") { li.style.display = "none"; }
            }
        }        
        return false;
    }

0 个答案:

没有答案