44 lines
1.1 KiB
JavaScript
44 lines
1.1 KiB
JavaScript
|
(function($){
|
||
|
|
const $input = $('.site-header__search-input');
|
||
|
|
const $container = $('<ul class="site-header__search-suggestions"></ul>').insertAfter($input);
|
||
|
|
let timer;
|
||
|
|
|
||
|
|
$input.on('keyup', function(){
|
||
|
|
const term = $(this).val().trim();
|
||
|
|
clearTimeout(timer);
|
||
|
|
if (term.length < 2) {
|
||
|
|
$container.empty().hide();
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
timer = setTimeout(() => {
|
||
|
|
$.getJSON(pandaLiveSearch.ajax_url, {
|
||
|
|
action: 'live_search',
|
||
|
|
term: term
|
||
|
|
}).done(function(results){
|
||
|
|
$container.empty();
|
||
|
|
if (results.length) {
|
||
|
|
results.forEach(item => {
|
||
|
|
$container.append(
|
||
|
|
`<li>
|
||
|
|
<a href="${item.permalink}">
|
||
|
|
<img src="${item.thumb}" alt=""/>
|
||
|
|
${item.title}
|
||
|
|
</a>
|
||
|
|
</li>`
|
||
|
|
);
|
||
|
|
});
|
||
|
|
$container.show();
|
||
|
|
} else {
|
||
|
|
$container.hide();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}, 300);
|
||
|
|
});
|
||
|
|
|
||
|
|
$(document).on('click', function(e){
|
||
|
|
if (!$(e.target).closest('.site-header__search-input, .site-header__search-suggestions').length) {
|
||
|
|
$container.hide();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
})(jQuery);
|