Сначала перейдите в Google, нажмите Настройки (в правом нижнем углу), измените Настройки поиска на «никогда не показывать мгновенные результаты. Таким образом, вы получите регулярное автозаполнение вместо полной страницы мгновенных результатов.
После сохранения настроек вернитесь на главную домашнюю страницу Google. Откройте инструменты разработчика вашего браузера и перейдите на вкладку Сеть. Если вы находитесь в Firefox, возможно, вам придется перезагрузить страницу.
Введите букву в поле поиска. Новая строка должна появиться в окне сети, которое вы только что открыли. Эта строка показывает, откуда пришли данные автозаполнения. Скопируйте этот URL. Это должно выглядеть примерно так:
https://www.google.com/complete/search?client=hp&hl=en&sugexp=msedr&gs_rn=62&gs_ri=hp&cp=1&gs_id=9c&q=a&xhr=t&callback=hello
Вы заметите свой поисковый запрос сразу после части, которая говорит q=
.
Добавьте &callback=myAmazingFunction
в конец URL. Вы можете заменить myAmazingFunction на любое имя, которое вы хотите назвать своей функцией, которая будет обрабатывать данные.
Ниже приведен пример кода, необходимого для отображения данных автозаполнения для поискового запроса «a».
<div id="output"></div>
<script>
/* this function shows the raw data */
function myAmazingFunction(data){
document.getElementById('output').innerHTML = data;
}
</script>
<script src="https://www.google.com/complete/search?client=hp&hl=en&sugexp=msedr&gs_rn=62&gs_ri=hp&cp=1&gs_id=9c&q=a&xhr=t&callback=hello&callback=myAmazingFunction"></script>
Теперь, когда вы знаете, как получить данные, следующим шагом будет автоматическое изменение этого последнего сценария (сценария с URL-адресом автозаполнения). Основная процедура такова: каждый раз, когда пользователь вводит что-либо в поле поиска (onkeyup), заменяет поисковый термин (q = что угодно) в URL, а затем добавляет к тексту сценарий с этим URL. Удалите предыдущий скрипт, чтобы тело не загромождалось.
Подробнее см. http://simplestepscode.com/autocomplete-data-tutorial/