按键时立即填充结果 [英] On key press instant result populating
本文介绍了按键时立即填充结果的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我需要下面的图片
我已经实现了代码，但是它只是像
I have implemented the code but its just auto populate like
我无法填充结果. 我已经实现了以下Google代码
I am not able to populate the result. I have implemented the google code as below
<script>
(function () {
var cx = '011189415628571362123:google';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
<gcse:search enableautocomplete="true"></gcse:search>
我需要的是Google节目之类的即时结果
What I need is instant result like google shows
您好，我进行了更改，但仍然没有得到结果，请查看下图.
Hi I made the changes but I am still not getting the result please review the below image.
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
(function ($, window) {
var elementName = '';
var initGCSEInputField = function () {
$('.gcse-container form.gsc-search-box input.gsc-input')
.on("keyup", function (e) {
if (e.which == 13) { // 13 = enter
var searchTerm = $.trim(this.value);
if (searchTerm != '') {
console.log("Enter detected for search term: " + searchTerm);
// execute your custom CODE for Keyboard Enter HERE
}
}
});
$('.gcse-container form.gsc-search-box input.gsc-search-button')
.on("click", function (e) {
var searchTerm = $.trim($('.gcse-container form.gsc-search-box input.gsc-input').val());
if (searchTerm != '') {
console.log("Search Button Click detected for search term: " + searchTerm);
// execute your custom CODE for Search Button Click HERE
}
});
};
var GCSERender = function () {
google.search.cse.element.render({
div: 'gcse_container',
tag: 'search'
});
initGCSEInputField();
};
var GCSECallBack = function () {
if (document.readyState == 'complete') {
GCSERender();
}
else {
google.setOnLoadCallback(function () {
GCSERender();
}, true);
}
};
window.__gcse = {
parsetags: 'explicit',
callback: GCSECallBack
};
})(jQuery, window);
(function () {
var cx = '017643444788069204610:4gvhea_mvga'; // Insert your own Custom Search engine ID here
var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
gcse.src = 'https://www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
})();
</script>
</head>
<body>
<div class="gcse-container" id="gcse_container">
<gcse:search enableautocomplete="true"></gcse:search>
</div>
</body>
推荐答案
以下CODE代码段将在每次击键时填充结果.点击Run code snippet按钮&然后单击Full Page按钮以获得更好的视图&然后检查它是否满足您的要求.它使用 Google自定义搜索元素控件API .研究该文档以进行进一步的自定义.
The following CODE snippet will populate result on every keystroke. Click Run code snippet button & then click Full Page button for a better view & then check to see if it satisfies your requirement. It uses Google Custom Search element control API. Study that document for further customization.
(function($, window) {
var elementName = '';
var lastSearchTerm = '';
var initGCSEInputField = function() {
$( '.gcse-container form.gsc-search-box input.gsc-input' )
.on( "keyup", function( e ) {
if( e.which == 13 ) {
// 13 = enter, execute custom CODE as necessary on enter
console.log("Enter detected");
}
else {
if( elementName == '' ) {
// assuming that we have only one search element on the page
var elements = google.search.cse.element.getAllElements();
for( var element in elements ) {
elementName = element;
if( elementName != '' ) {
break;
}
}
}
if( elementName != '' ) {
// searching on each keystroke
var searchTerm = $.trim( this.value );
if( searchTerm != lastSearchTerm ) {
// console.log( searchTerm );
google.search.cse.element.getElement( elementName ).execute( searchTerm );
lastSearchTerm = searchTerm;
}
}
}
});
};
var GCSERender = function() {
google.search.cse.element.render({
div: 'gcse_container',
tag: 'search'
});
initGCSEInputField();
};
var GCSECallBack = function() {
if (document.readyState == 'complete') {
GCSERender();
}
else {
google.setOnLoadCallback(function() {
GCSERender();
}, true );
}
};
window.__gcse = {
parsetags: 'explicit',
callback: GCSECallBack
};
})(jQuery, window);
(function() {
var cx = '017643444788069204610:4gvhea_mvga'; // Insert your own Custom Search engine ID here
var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
gcse.src = 'https://www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
})();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="gcse-container" id="gcse_container">
<gcse:search enableAutoComplete="true"></gcse:search>
</div>
这篇关于按键时立即填充结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
