使用HTML Javascript搜索

Question

我有下面的HTML代码，我还将有一个用于输入关键字的文本框，我想要的是，当用户在文本框中使用FirstName和LastName在HTML代码中编写javascript搜索时，并且在比较项目时，如果项目不匹配，我想display: none其容器div。如何使用JS并在firefox和IE上工作]

<div id="contact_4">
    <input class="contactChk" id="chk_4" type="checkbox" />
    <img alt="" src='img/4.jpg' width="25px" height="25px" />
    <span id="contactName_4" class="contactItem">
        FirstName LastName
    </span>
    <br />
</div>
<div id="contact_5">
    <input class="contactChk" id="chk_5" type="checkbox" />
    <img alt="" src='img/5.jpg' width="25px" height="25px" />
    <span id="contactName_5" class="contactItem">
        ACharName AnyLast
    </span>
    <br />
</div>
<div id="contact_6">
    <input class="contactChk" id="chk_6" type="checkbox" />
    <img alt="" src='img/6.jpg' width="25px" height="25px" />
    <span id="contactName_6" class="contactItem">
        BCharName AnyLast
    </span>
    <br />
</div>
<div id="contact_7">
    <input class="contactChk" id="chk_7" type="checkbox" />
    <img alt="" src='img/7.jpg' width="25px" height="25px" />
    <span id="contactName_7" class="contactItem">
        CCharName AnyLast
    </span>
    <br />
</div>

Answer 1

如果您要显示更多的联系人，这看起来效率很低。最简单的方法是使用jQuery并将函数绑定到文本字段的keyup事件：（假设上面的代码包含在<div id="contactlist">之类的东西中）

Answer 2

这可能会帮助您：