Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 27.09.2016, 18:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

TommyDBrown,
$(function() {
    var city = $(".header__city-item"),
        contact = $(".contacts__item");
    city.on("click", function(event) {
        event.preventDefault();
        var i = city.index(this);
        contact.removeClass("contacts__item--active").eq(i).addClass("contacts__item--active")
    })
});
Ответить с цитированием
  #12 (permalink)  
Старый 27.09.2016, 18:51
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Сообщение от TommyDBrown
Для каждого города также есть html
Второго списка я не осилил.

<span>Ваш город: <a c="" class="header__city-link" href="#">сюда же вписывается город, или куда еще?</a></span>
Ответить с цитированием
  #13 (permalink)  
Старый 27.09.2016, 19:01
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Кстати, эта хрень не нужна. И без href все нормально чакает.

Цитата:
href="#"
Ответить с цитированием
  #14 (permalink)  
Старый 27.09.2016, 19:11
Новичок на форуме
Отправить личное сообщение для TommyDBrown Посмотреть профиль Найти все сообщения от TommyDBrown
 
Регистрация: 28.06.2011
Сообщений: 6

Как-то я совсем с этим запутался, возникло ещё больше вопросов как это реализовать, я понимаю, что вы прекрасно понимаете, то о чем пишите, я к сожалению понимаю это отчасти, в силу узких знаний Javascript не могу написать скрипт сам. Моя изначальная реализация была мне понятней, а главное работала, правда коряво
Ответить с цитированием
  #15 (permalink)  
Старый 27.09.2016, 19:18
Новичок на форуме
Отправить личное сообщение для TommyDBrown Посмотреть профиль Найти все сообщения от TommyDBrown
 
Регистрация: 28.06.2011
Сообщений: 6

Попробовал вариант рони
$(function() {
    var city = $(".header__city-item"),
        contact = $(".contacts__item");
    city.on("click", function(event) {
        event.preventDefault();
        var i = city.index(this);
        contact.removeClass("contacts__item--active").eq(i).addClass("contacts__item--active")
    })
});

Он почему то подсвечивает не те города, которые я выбираю
Ответить с цитированием
  #16 (permalink)  
Старый 27.09.2016, 19:21
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Сообщение от TommyDBrown
Он почему то подсвечивает не те города, которые я выбираю
значит у вас другой html, делайте макет полностью здесь или в любой песочнице
Ответить с цитированием
  #17 (permalink)  
Старый 27.09.2016, 19:23
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

TommyDBrown,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
   .contacts__item--active  {
     background-color: #D3D3D3;
   }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
var city = $(".header__city-item"), contact = $(".contacts__item");
city.on("click", function(event) {
event.preventDefault();
var i = city.index(this);
contact.removeClass("contacts__item--active").eq(i).addClass("contacts__item--active")
})
});
  </script>
</head>

<body>
<div class="header__center-inner">
        <div class="header__city">
          <span>Ваш город: <a class="header__city-link" href="#">выберите город</a></span>
          <ul class="header__city-list">
            <li class="header__city-item header__city-item--belgorod"><a href="#">Белгород</a></li>
            <li class="header__city-item header__city-item--vladimir"><a href="#">Владимир</a></li>
            <li class="header__city-item header__city-item--jeleznogorsk"><a href="#">Железногорск</a></li>
            <li class="header__city-item header__city-item--kursk"><a href="#">Курск</a></li>
            <li class="header__city-item header__city-item--orel"><a href="#">Орёл</a></li>
          </ul>
        </div>

<ul>
<li class="contacts__item contacts__item--belgorod">Белгород</li>
<li class="contacts__item contacts__item--vladimir">Владимир</li>
<li class="contacts__item contacts__item--jeleznogorsk">Железногорск</li>
<li class="contacts__item contacts__item--kursk">Курск</li>
<li class="contacts__item contacts__item--orel">Орёл</li>
</ul>
</div>
</body>
</html>
Ответить с цитированием
  #18 (permalink)  
Старый 27.09.2016, 19:24
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

TommyDBrown,

Причем тут js. По-русски надо писать.

У тебя есть список? Список всего 1 штука. В каждом элементе списка есть id. У тебя есть транслит городов, в id и записывай. Есть ссылка, по которой открывается список.

Когда юзер щелкает по элементу в списке, ты получаешь всю инфу с этого элемента. Берешь id и записываешь в любой атрибут ссылки. Туда же записываешь название города. Список закрывается, дело сделано.

Теперь если юзер переехал или его город разбомбил запрещенный в россии игил, он открывает список и там выделяется его город по связке тот самый атрибут - id.

И вообще перехоти это делать. У тебя город уже написан в ссылке, и так понято ГДЕ он живет. Если он открыл список, ему нужен другой город. Зачем ему подсвечивать то, что и так уже видно?
Ответить с цитированием
  #19 (permalink)  
Старый 27.09.2016, 19:26
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

рони, нет, ТС просто всех запутал. Не так делается. Щас.
Ответить с цитированием
  #20 (permalink)  
Старый 27.09.2016, 19:38
Новичок на форуме
Отправить личное сообщение для TommyDBrown Посмотреть профиль Найти все сообщения от TommyDBrown
 
Регистрация: 28.06.2011
Сообщений: 6

рони, в моем случае второй список имеет немного другую упорядоченность, извиняюсь, что ввел вас в заблуждение
<ul>
<li class="contacts__item contacts__item--jeleznogorsk"></li>
<li class="contacts__item contacts__item--kursk"></li>
<li class="contacts__item contacts__item--orel"></li>
<li class="contacts__item contacts__item--belgorod"></li>
<li class="contacts__item contacts__item--vladimir"></li>
</ul>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Фильтр по начальным буквам слова Shasoft Общие вопросы Javascript 13 22.03.2015 11:20
Выбор случайного слова из списка alerzo Элементы интерфейса 3 19.04.2014 15:46
необходими разделить строку на слова и положить слова в массив при помощи цикла for oneee Общие вопросы Javascript 5 05.09.2012 14:30
Динамический селектор raindew Элементы интерфейса 3 20.11.2011 18:37
Предыдущий селектор KupueIIIKo jQuery 1 05.10.2011 01:27