Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.11.2013, 11:15
Интересующийся
Отправить личное сообщение для vertmann Посмотреть профиль Найти все сообщения от vertmann
 
Регистрация: 10.10.2013
Сообщений: 13

Выпадающий список без кнопок-стрелок для открытия
Помогите пожалуйста с решением такого вопроса...

Мне нужно сделать выпадающий список, но такой, чтобы выбранный элемент был просто как ссылка, т.е. без всех этих кнопок-стрелочек по кликам которых список открывается.

Кликаю по ссылке, открывается список, выбираю там что-нибудь и выбранный элемент меняется.
Ответить с цитированием
  #2 (permalink)  
Старый 13.11.2013, 11:29
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Сообщение от vertmann
Мне нужно сделать выпадающий список, но такой, чтобы выбранный элемент был просто как ссылка
...
Кликаю по ссылке, открывается список, выбираю там что-нибудь и выбранный элемент меняется.
И в чем проблема?

Например вот такая конструкция
<div class='select'>
	<a href='#'>Item 1</a>
	<ul>
		<li>Item 1</li>
		<li>Item 2</li>
		<li>Item 3</li>
		<li>Item 4</li>
	</ul>
</div>

поможет тебе в этом.
Добавь ЦССа, скрипта и вуаля!
Ответить с цитированием
  #3 (permalink)  
Старый 13.11.2013, 12:00
Интересующийся
Отправить личное сообщение для vertmann Посмотреть профиль Найти все сообщения от vertmann
 
Регистрация: 10.10.2013
Сообщений: 13

Сообщение от ksa Посмотреть сообщение
И в чем проблема?

Например вот такая конструкция
<div class='select'>
	<a href='#'>Item 1</a>
	<ul>
		<li>Item 1</li>
		<li>Item 2</li>
		<li>Item 3</li>
		<li>Item 4</li>
	</ul>
</div>

поможет тебе в этом.
Добавь ЦССа, скрипта и вуаля!
ну т.е. ul должен быть hidden и при клике по ссылке он открывается. Как мне менять выбранный элемент в анкоре ссылки?
Ответить с цитированием
  #4 (permalink)  
Старый 13.11.2013, 13:18
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Сообщение от vertmann
Как мне менять выбранный элемент в анкоре ссылки?
У элементов ДОМ есть атрибуты и innerHTML, меняй, что тебе будет нужно...
Т.е. проблем пока не вижу...
Ответить с цитированием
  #5 (permalink)  
Старый 14.11.2013, 18:21
Интересующийся
Отправить личное сообщение для vertmann Посмотреть профиль Найти все сообщения от vertmann
 
Регистрация: 10.10.2013
Сообщений: 13

Сообщение от ksa Посмотреть сообщение
У элементов ДОМ есть атрибуты и innerHTML, меняй, что тебе будет нужно...
Т.е. проблем пока не вижу...
Проблема вот в чем, у меня в цикле выводится список городов через Smarty, по клику следующий список открывается:
<a href="javascript:void(0);" class = "select-city">вот тут должен выводится выбранный город</a>
<div class = "city-list" style = "display:none;">
    <ul class = "cities" name="my_city_code">
        {{foreach $cities as $ac}}
            <li><a href="javascript:void(0);" class = "city_code" name = "city_code" value = "{{$ac.name}}{{$ac.type}}">{{$ac.name}} {{$ac.type}}</a></li>
        {{/foreach}}
    </ul>
</div>


Для начала я пытаюсь получить значение атрибута value ссылки и вывести его, выводится пустое окно, думаю, это связано с тем, что городов в списке выводится много.

$('.city_code').live('click', function() {
        city_code = $('.city_code').attr('value');
        alert(city_code);
    });
Ответить с цитированием
  #6 (permalink)  
Старый 14.11.2013, 19:46
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

Сообщение от Rise
Неверно верно так:
А ещё лучше - так:
$(document).on('click', '.city_code', function() {
	var city_code = this.value;
	alert(city_code);
});
Ответить с цитированием
  #7 (permalink)  
Старый 15.11.2013, 10:28
Интересующийся
Отправить личное сообщение для vertmann Посмотреть профиль Найти все сообщения от vertmann
 
Регистрация: 10.10.2013
Сообщений: 13

Сообщение от Rise Посмотреть сообщение
Неверно верно так:
$('.city_code').live('click', function() {
	var city_code = this.value;
	alert(city_code);
});
теперь выводит undefined

пробовал так:

var city_code = this.attr('value');

но тоже не получается. мне нужно получить значение атрибута ссылки
Ответить с цитированием
  #8 (permalink)  
Старый 15.11.2013, 11:43
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Сообщение от vertmann
пробовал так:

var city_code = this.attr('value');

но тоже не получается
Когда же ты перестанешь "пробовать", а начнешь читать книжки?

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(function (){
	$(document).on('click', '.city_code', function() {
		var city_code = $(this).attr('value');
		alert(city_code);
	});
});
</script>
</head>
<body>
<a href="javascript:void(0);" class = "select-city">вот тут должен выводится выбранный город</a>
<div class = "city-list" style = "">
    <ul class = "cities" name="my_city_code">
		<li>
			<a href="javascript:void(0);" class = "city_code" name = "city_code" value = "{{$ac.name}}{{$ac.type}}">
				Бивас, тест!
			</a>
		</li>
    </ul>
</div>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Решение проблемы кодировок для AJAX и PHP без iconv (cp1251 в AJAX) Serge Ageyev AJAX и COMET 10 24.04.2013 20:48
Форма для добавления отзывов без перезагрузки страницы Luter1984 Общие вопросы Javascript 4 09.11.2010 09:59
Стилизированный выпадающий список king_julian Элементы интерфейса 3 01.11.2010 16:16
Список специфичных методов для FF why.not? Firefox/Mozilla 2 01.11.2010 12:58
Выпадающий список с возможностью ввода текста LA_ Элементы интерфейса 6 27.10.2010 16:30