Yandex suggest, XMLHttpRequest - на локальной странице :: Web-программирование

В общем, нашёл решение через аддон Greasemonkey (для firefox).

Кому интересно:
1. Устанавливаете Greasemonkey в firefox.
2. На локальной странице оставляете такой код:

Код:

<head>

<style type="text/css">
.rysul {list-style-type:none; margin:0px}
.rysli {margin-left:-40px; padding-left:10px; padding-top:5px; padding-bottom:6px; cursor:pointer; font:16px sans-serif}
</style>

...
</head>

...

<form action="https://yandex.ru/search" id="frmsrch" style="font-size:16; border-radius:10px; padding:10; background:yellow">
<b>Поиск в <font color="red">Я</font>ндексе:</b> 
<input id="srch" name="text" size="140" style="font-size:16"/>
</form>
<div id="rys" style="position:absolute; display:none; border:1px solid black; background-color:#FFFBF0"></div>

Стили можно менять, id-шники не трогайте.

3. В Greasemonkey создаёте скрипт с любым названием:

Код:

// ==UserScript==
// @name getYaSuggest
// @version 1
// @grant GM.xmlHttpRequest
// ==/UserScript==

//Переменные для настройки скрипта (остальные задаётся в стилях HTML-страницы)
var setLenVal = 3 //Минимальное кол-во символов для запроса подсказок
var setColorSel = "#FFEBA0" //Цвет выделенного пункта

//Ниже - собственно рабочий код
ro = new Object();
ro.method = "GET";
ro.onload = receiveYaSuggest;

srch = document.getElementById('srch');
rys = document.getElementById('rys');
frmsrch = document.getElementById('frmsrch');

rys.style.left = srch.getBoundingClientRect().left + window.scrollX;
rys.style.top = srch.getBoundingClientRect().bottom + window.scrollY;
rys.style.width = srch.getBoundingClientRect().width;

srch.addEventListener('keyup', getYaSuggest, false);
srch.addEventListener('focus', getYaSuggest, false);
srch.addEventListener('mousedown', getYaSuggest, false);
srch.addEventListener('blur', function() {rys.style.display = "none"}, false);
srch.addEventListener('keydown', srchKeydown, false);

var i = 0;
var arrli = new Array();

function getYaSuggest(event) {
if ((event.key == 'ArrowDown') ||
(event.key == 'ArrowUp') ||
(event.key == 'ArrowRight') ||
(event.key == 'ArrowLeft') ||
(event.key == 'Escape') ||
(event.key == 'Enter')) {return};
if (srch.value.length >= setLenVal) {
ro.url = "https://suggest.yandex.ru/suggest-ya.cgi?part=" + srch.value;
GM.xmlHttpRequest(ro)
} else {rys.style.display = "none"};
}

function receiveYaSuggest(r)
{
arr = r.responseText.substring( r.responseText.indexOf("[",16)+1, r.responseText.indexOf("]") ).replace(new RegExp("\"","g"),"").split(",");
if ((arr.length != 0) && (arr[0] != "")) {
rys.style.display = "block";
arrs = "<ul class=\"rysul\" id=\"idrysul\">";
arr.forEach(function(item) {arrs = arrs + "<li class=\"rysli\">"+item+"</li>"});
arrs+="</ul>";
document.getElementById('rys').innerHTML = arrs;
arrli = Array.from( document.getElementById('idrysul').getElementsByTagName("li") );
arrli.forEach( function(item) {item.addEventListener('mousedown', function() {srch.value = this.innerText; frmsrch.submit()}, false)} );
arrli.forEach( function(item) {item.addEventListener('mouseenter', function() {i = arrli.indexOf(this); HlSel()}, false)} );
i=0;
} else {rys.style.display = "none"}
};

function srchKeydown(event) {
if (arrli.length == 0) {return};
if (event.key == 'ArrowDown') { i++; if (i>(arrli.length-1)) {i=0}; HlSel(); srch.value = arrli[i].innerText; };
if (event.key == 'ArrowUp') { i--; if (i<0) {i=arrli.length-1}; HlSel(); srch.value = arrli[i].innerText; };
if (event.key == 'Enter') { rys.style.display = "none" };
if (event.key == 'Escape') { rys.style.display = "none" };
}

function HlSel() {
if (arrli.length == 0) {return};
arrli.forEach( function(item) {item.style.backgroundColor = "transparent"} );
arrli[i].style.backgroundColor = setColorSel;
}

Всё, должно работать, как в самом Яндексе.

Модерирует : Cheery
Версия для печати • Подписаться • Добавить в закладки