jquery实现网页查找功能示例分享(3)

function clearSelection(){
        $('p').each(function(){
            //找到所有highlight属性的元素；
            $(this).find('.highlight').each(function(){
                $(this).replaceWith($(this).html());//将他们的属性去掉；
            });
        });
}

最后加上showTips()函数，该函数用来显示在输入查找关键字后的查找结果提示信息。

复制代码 代码如下:

$(function(){
    var tipsDiv = '<div></div>'; 
    $( 'body' ).append( tipsDiv );
    function showTips( tips, height, time,left ){ 
        var windowWidth = document.documentElement.clientWidth; 
        $('.tipsClass').text(tips);
        $( 'div.tipsClass' ).css({ 
        'top' : height + 'px', 
        'left' :left + 'px', 
        'position' : 'absolute', 
        'padding' : '8px 6px', 
        'background': '#000000', 
        'font-size' : 14 + 'px', 
        'font-weight': 900,
        'margin' : '0 auto', 
        'text-align': 'center', 
        'width' : 'auto', 
        'color' : '#fff', 
        'border-radius':'2px', 
        'opacity' : '0.8' ,
        'box-shadow':'0px 0px 10px #000',
        '-moz-box-shadow':'0px 0px 10px #000',
        '-webkit-box-shadow':'0px 0px 10px #000'
        }).show(); 
        setTimeout( function(){$( 'div.tipsClass' ).fadeOut();}, ( time * 1000 ) ); 
    } 
});

您可能感兴趣的文章: