使用js實現前端內容實時搜尋

2022-04-04 12:11:06 字數 1555 閱讀 8351

根據需要在搜尋框中輸入搜尋關鍵字,實時搜尋出相應的顯示結果,並高亮顯示。

實現**:

/*

* * @brief 搜尋一條房間中的符合要求的發言

* @param $keyword 搜尋的關鍵字

*/var isskip = false

; $('.search-icon').click(function

() );

function

showsearch() );

}$('.delete-icon').click(function

() );

function

hidesearch() , 'slow');

$('.search-content').removeclass('bounce');

isskip = false

; }

$('.search-content input').keyup(function

(e)

else

});$('.talk-board-container').on('click', '.chat-item', chatitemclick);

function

chatitemclick()

isskip = false

; }

function

skiptodest(itemindex) , 'slow');

}function

backtoorigin()

$('#search-img').on('click', function

() );

function

removelasthighlightresult() );}}

function

marksearchresult()

$.each($chatcontent,

function

(index, content) ).text().replace(

new regexp(keyword, 'g'), '' + keyword + '');

$a=$(content).find('a').clone();

$span = $(content).find('a span').clone();

$(content).html($(content).contents().filter(

function

() ).text().replace(

new regexp(keyword, 'g'), '' + keyword + ''));

$(content).prepend($a);

$(content).find('a').html(matchstr);

$(content).find('a').prepend($span);

} else

}});

if (!searchresult)

}/*搜尋工作結束

*/

使用js實現前端快取

使用js實現前端快取的工具類,在支援html5的瀏覽器上優先使用html5的storage進行快取 呼叫方式為 例如儲存 sy.cookiestring key value 此處使用的第三方js庫為 jquery.cookie.js jquery.js json2.js var sy sy sy.d...

使用JS實現前端快取

在前端瀏覽器中,有些資料 比如資料字典中的資料 可以在第一次請求的時候全部拿過來儲存在js物件中,以後需要的時候就不用每次都去請求伺服器了。對於那些大量使用資料字典來填充下拉框的頁面,這種方法可以極大地減少對伺服器的訪問。這種方法特別適用於使用iframe的框架。具體實現思路和方法 建立乙個cach...

前端實現全域性搜尋

ps vue 中實現 實現展示搜尋結果 computed return this.dormitory lists 展示list dormitory 全資料 some 方法用於檢測陣列中的元素是否滿足指定條件 some 方法會依次執行陣列的每個元素 如果有乙個元素滿足條件,則表示式返回true 剩餘的...