Скрипт для выбора пункта выпадающего списка

Статус
Закрыто для дальнейших ответов.

Chris

Well-Known Member
Регистрация
23.04.2012
Сообщения
68
Доброго времени суток! Спрятал select с помощью opacity, поверх position-absolute поставил блок с input и <a>. Клик по select есть, список выпадает, но не знаю, что нужно прописать, чтобы выбирался пункт. Заранее благодарю.
 

czp

czp
Регистрация
05.06.2011
Сообщения
635
нужео в скрипте указать, что бы он выбрал вам нужный пунк
 

czp

czp
Регистрация
05.06.2011
Сообщения
635
наверное точно так же, как вы и описали проблему
 

Volter9

defined('SURRENDER') or die(); // StarWars
Регистрация
27.05.2012
Сообщения
1 145

Chris

Well-Known Member
Регистрация
23.04.2012
Сообщения
68
Код:
<span class="input-box">
<select>
<option>Санкт-Петербург</option>
<option>Екатеринбург</option>
<option>Москва</option>
<option>Самара</option>
</select>
<div class="select-check">
<input type="text" class="fleft">
<a href="#" class="select-button fleft"></a>
</div>
</span>
Код:
select {
width: 190px;
opacity: 0;
-ms-filter: progidXImageTransform.Microsoft.Alpha(Opacity = 0);
filter: alpha(opacity = 0);
position:relative;
z-index:1;
}
.input-box{
position:relative;
}
.input-box select{
margin:0 10px 0 0 !important;
}
.select-check{
position:absolute;
top:-3px;
right:4px;
width:200px;
}
.select-check input{
width:158px;
height:25px;
border-radius:0;
box-shadow:0 0 0 rgba(0, 0, 0, 0) !important;
}
.select-check a.select-button{
background:url(../img/arrow-select.png) no-repeat 0 0;
display:block;
width:30px;
height:30px;
}
наверное точно так же, как вы и описали проблему
В этом и заключается проблема, что я незнаю как этого сделать.
 

motek

злой как @
Регистрация
13.04.2010
Сообщения
730
у меня option раскрываются при нажатии на левую кнопку мышки

дайте полный адрес фона ссылки, для визуальной ясности
Код:
.select-check a.select-button { background:url(../img/arrow-select.png) no-repeat 0 0; ...}
 

AngelGabriel

И имя мне - легион
Регистрация
23.11.2008
Сообщения
778
не пойму назначение данного кода зачем инпут нужен
нужный путнкт выбирается, прсто его не видно так как прозрачность 0
http://learn.javascript.ru/play/l2yNv
-------------------------------------------------
Если вы хотели что бы при вводе текста в инпут выскакивал нужный город то это делается совсем не так.
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
Ну, хотя бы так:
Код:
<span class="input-box">
<select onchange="document.getElementById('select_show').value = this.value">
<option>Санкт-Петербург</option>
<option>Екатеринбург</option>
<option>Москва</option>
<option>Самара</option>
</select>
<div class="select-check">
<input id="select_show" type="text" class="fleft" value="Санкт-Петербург">
<a href="#" class="select-button fleft"></a>
По сравнению с вашим кодом здесь добавлен обработчик события изменения состояния селектора (onchange), идентификатор для поля ввода (id="select_show") и его начальное значение (value="Санкт-Петербург").

Кстати, элемент SPAN является фразообразующим (по старому - строковым) и в него нельзя вкладывать блоки (DIV).
 

Chris

Well-Known Member
Регистрация
23.04.2012
Сообщения
68
не пойму назначение данного кода зачем инпут нужен
Честно говоря, видел пример, по нему сделал свой и должным образом не разобрал его. Но с вашим комментарием понял, что только лишь для ввода текста и нужен input, за что благодарю вас ;)

Кстати, элемент SPAN является фразообразующим (по старому - строковым) и в него нельзя вкладывать блоки (DIV).
Да, вкурсе, задаю им display:block, но тут упустил т.к. боролся с этим место очень долгое время, менял код туда,сюда. Но замечание учту.
Выбрал вариант tigra60 т.к. он отлично подошел, Спасибо большое! :)
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
понял, что только лишь для ввода текста и нужен input
Да я вот боюсь, что ничего вы не поняли! INPUT здесь нужен только для того, чтобы показать текущее состояние селектора. Как по мне, в коде далеко не лучший выбор элементов для визуального отображения (поле ввода и ссылка), Я бы взял просто SPAN.
 

Volter9

defined('SURRENDER') or die(); // StarWars
Регистрация
27.05.2012
Сообщения
1 145
Я бы взял просто SPAN.
Так, а как же будет отображаться состояние?
Так:

Код:
<span class="input-box">
<select onchange="document.getElementById('select_show').innerHTML = this.value">
<option>Санкт-Петербург</option>
<option>Екатеринбург</option>
<option>Москва</option>
<option>Самара</option>
</select>
<div class="select-check">
<span id="select_show">Санкт-Петербург</span>
<a href="#" class="select-button fleft"></a>
 

Chris

Well-Known Member
Регистрация
23.04.2012
Сообщения
68
Так:
Код:
<span class="input-box">
<select onchange="document.getElementById('select_show').innerHTML = this.value">
<option>Санкт-Петербург</option>
<option>Екатеринбург</option>
<option>Москва</option>
<option>Самара</option>
</select>
<div class="select-check">
<span id="select_show">Санкт-Петербург</span>
<a href="#" class="select-button fleft"></a>
Ну тогда думаю и без ссылки, т.к. при клике на нее кидает в начало документа.
 

mrlasking

$_GET['rich'] or die('trying');
Регистрация
22.05.2012
Сообщения
323
Ну тогда думаю и без ссылки, т.к. при клике на нее кидает в начало документа.
А ретурны и войд(0) для кого?... грррр!

З.Ы. Когда видел начало топика, даже не предполагал, что подобный вопрос можно затянуть на полтора десятка постов. *негодуе*
 
Статус
Закрыто для дальнейших ответов.
Верх Низ