如何在html中实现自动文本搜索?

时间:2015-01-30 18:37:16

标签: javascript html

我想在我的网页上添加文字搜索功能。但我想让它自动搜索 当用户输入文本而不点击查找按钮时。我想删除按钮并使其自动搜索

示例代码

function doSearch(text) {
    if (window.find && window.getSelection) {
        document.designMode = "on";
        var sel = window.getSelection();
        sel.collapse(document.body, 0);
        
        while (window.find(text)) {
            document.getElementById("button").blur();
            document.execCommand("HiliteColor", false, "yellow");
            sel.collapseToEnd();
        }
        document.designMode = "off";
    } else if (document.body.createTextRange) {
        var textRange = document.body.createTextRange();
        while (textRange.findText(text)) {
            textRange.execCommand("BackColor", false, "yellow");
            textRange.collapse(false);
        }
    }
}
<input type="text" id="search">
<input type="button" id="button" onmousedown="doSearch(document.getElementById('search').value)" value="Find">

<div id="content">
    <p>Here is some searchable text with some lápices in it, and more lápices, and some <b>for<i>mat</i>t</b>ing</p>
</div> 

1 个答案:

答案 0 :(得分:0)

<input type="text" id="search" onkeypress="doSearch(this.value)">

http://www.w3schools.com/jsref/event_onkeypress.asp