Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / перемещение курсора по списку при нажатии кнопок / 5 сообщений из 5, страница 1 из 1
02.03.2010, 13:43:27
    #36496956
EmilRegis
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
перемещение курсора по списку при нажатии кнопок
Здравствуйте...
Помогите пожалуйста, что-то сам сообразить не могу...Требуется сделать примерно так же как в гугле, то есть есть текстовое поле, в него вводится какое-то значение и аджаксом подгружается с сервера список подходящих к значению вариантов..Например ввожу све - выводится Свердловск, Светлоград и т.д...
Основное я сделал, у меня при вводе значений списком заполняется див и делается видимым...
Проблема в том,чтобы при нажатии кнопок вверх, вниз перемещать курсор по этому списку...а при нажатии кнопки enter - вставлять выбранное значение в текстовое поле...
если можно приведите примерчик, желательно без использования разных библиотек

В данный момент сделано так, что данные получаются в формате json, которые вставляются во внешний див в виде собственных дивов
Код: plaintext
1.
2.
3.
4.
<div id="city_list" class="objlist">
  <div>Свердловск</div>
  <div>Светлоград</div>
</div>
...
Рейтинг: 0 / 0
02.03.2010, 13:57:53
    #36497020
Яростный Меч
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
перемещение курсора по списку при нажатии кнопок
EmilRegis,

я бы на вашем месте очень внимательно разобрал jquery автокомплит, как там сделано. И наклепал бы что-то подобное.

Навскидку - обрабатывайте onkeydown полем ввода. в Евенте для него можно получить код нажатой клавиши. Если кнопка "вверх" или "вниз" - программно подсвечивать строку.

По событиям ознакомиться тут
...
Рейтинг: 0 / 0
02.03.2010, 14:15:02
    #36497098
EmilRegis
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
перемещение курсора по списку при нажатии кнопок
в данный момент сделано так
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
<script>
var keyflag = - 1 ;
function insertToTextField(val){
	document.getElementById('city_text').value = val;
	//document.getElementById(regiontype).style.display = 'none';
}
function stylechange(el,bol){
	if(bol){
		el.style.backgroundColor = 'blue';
		el.style.color = 'white';
	}
	else{
		el.style.backgroundColor = 'white';
		el.style.color = 'black';
	}
}

function listkeyclick(list_id,kcode){
	var len = document.getElementById(list_id).childNodes.length; //сколько детишек в списке
	if (len>keyflag+ 1  && (kcode== 40  || kcode== 38 )){
		if (kcode ==  40 ) keyflag++;			//кнопка вниз
		else if (kcode ==  38 ) keyflag--;	//кнопка вверх
		insertToTextField(document.getElementById(list_id).childNodes[keyflag].innerHTML); //вставляем в текстовое поле
		stylechange(document.getElementById(list_id).childNodes[keyflag],true); //меняем стиль выбранного дива
	}
</script>
.................
<div onmouseout = 'city_vis=false;' onmouseover = 'city_vis=true;'> 
       <div id="hide_select" >
	     <input type="text" id="city_text" onkeyup="getObjList('town',this.value);" onclick="clickTextField('town',this.value);"  onkeydown = "listkeyclick('city_list',event.keyCode);" onfocus="keyflag = -1"/>
	</div>
        <div id="city_list" class="objlist" >
	</div>
</div>
но что-то работает не так как хотелось бы)
при нажатии на кнопку вниз - вставляется в текстовое поле и вместо списка остаётся единственное выбранное значение
...
Рейтинг: 0 / 0
03.03.2010, 11:55:28
    #36499285
EmilRegis
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
перемещение курсора по списку при нажатии кнопок
решил не изобретать велосипед и заюзать jquery...
сколько не искал в интернете везде в jquery-компоненте посылается get-запрос на сервер...
есть ли аналог, посылающий post-запрос?
...
Рейтинг: 0 / 0
03.03.2010, 11:57:31
    #36499288
Яростный Меч
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
перемещение курсора по списку при нажатии кнопок
EmilRegisесть ли аналог, посылающий post-запрос?1) Нафига?
2) Перепиши компонент. Замени $.get на $.post . Не более чем.
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / перемещение курсора по списку при нажатии кнопок / 5 сообщений из 5, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]