Помогите пож с JSON, передача id ссылки.

[wisma]

Здравствуйте, есть скрипт который передает параметры выбора опций html imput.:

<script type="text/javascript">
  jQuery.noConflict();
  jQuery(document).ready(function(){
    jQuery('.popupregion input').click(function(){
      var loc = 0;
      loc = jQuery('.popupregion select option:selected').val();
      jQuery.ajax({
        url: '/pop.php?loc='+loc,
        dataType : "json",
        success: function (data, textStatus) {
          if(data.ok === true){
            document.location.href = document.location.href;
          }
        }              
      });
      return false;
    });
  });
</script>

Сама формочка:

<div class="popupregion"<?php if((isset($_COOKIE['proc'])&&isset($_COOKIE['lproc']))){ ?> style="display: none;"<?php } ?>>
  <div class="block">
    <p>ТЕКСТ</p>
    <div class="select">
      
        <option value="1">Черкасская область</option>
        <option value="2">Черниговская область</option>
        <option value="3">Черновецкая область</option>
        <option value="4">Днепропетровская область</option>
        <option value="5">Донецкая область</option>
        <option value="6">Ивано-Франковская область</option>
        <option value="7">Харьковская область</option>
        <option value="8">Херсонская область</option>
        <option value="9">Хмельницкая область</option>
        <option value="10">Кировская область</option>
        <option value="11">Крым</option>
        <option value="12">Киев</option>
        <option value="13">Киевская область</option>
        <option value="14">Луганская область</option>
        <option value="15">Львовская область</option>
        <option value="16">Николаевская область</option>
        <option value="17">Одесская область</option>
        <option value="18">Полтавская область</option>
        <option value="19">Ровненская область</option>
        <option value="20">Севастополь</option>
        <option value="21">Сумская область</option>
        <option value="22">Тернопольская область</option>
        <option value="23">Винницкая область</option>
        <option value="24">Волынская область</option>
        <option value="25">Закарпатская область</option>
        <option value="26">Запорожская область</option>
        <option value="27">Житомирская область</option>
        <option value="0">Я не из Украины</option>
      </select>
      <input type="button" value="выбрать">
    </div>
  </div>
</div>

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

url: '/pop.php?loc='+loc

, добавлял id ссылки, и при нажатии на ссылку происходило тоже самое что и при собитии

<input type="button" value="выбрать">

Примерно накидал себе ссылки...

<a id="1" href="#">Черкасская область</a>
        <a id="2" href="#"> Черниговская область</a>
        <a id="3" href="#">Черновецкая область</a>
        <a id="4" href="#">Днепропетровская область</a>
        <a id="5" href="#">Донецкая область</a>
        <a id="6" href="#">Ивано-Франковская область</a>
        <a id="7"  href="#">Харьковская область</a>
        <a id="8" href="#">Херсонская область</a>
        <a id="9" href="#">Хмельницкая область</a>
        <a id="10" href="#">Кировская область</a>
        <a id="11" href="#">Крым</a>
        <a id="12" href="#">Киев</a>
        <a id="13" href="#">Киевская область</a>
        <a id="14" href="#">Луганская область</a>
        <a id="15" href="#">Львовская область</a>
        <a id="16" href="#">Николаевская область</a>
        <a id="17" href="#">Одесская область</a>
        <a id="18" href="#">Полтавская область</a>
        <a id="19" href="#">Ровненская область</a>
        <a id="20" href="#">Севастополь</a>
        <a id="21" href="#">Сумская область</a>
        <a id="22" href="#">Тернопольская область</a>
        <a id="23" href="#">Винницкая область</a>
        <a id="24" href="#">Волынская область</a>
        <a id="25" href="#">Закарпатская область</a>
        <a id="26" href="#">Запорожская область</a>
        <a id="27" href="#">Житомирская область</a>
        <a id="0" href="#">Я не из Украины</a>

а вот с js у меня большие проблемы( почитав кучу текста про это все ничему ненаучился и ничего у меня не вышло(, помогите пожалуйста.

[danik.js]

jQuery.noConflict();

Сайт на джумле чтоли? Выкинь нафиг jQuery - глупо юзать библиотеку из 10000 строк ради пары функций..
Код на чистом js:

// оборачиваем код в функцию, дабы не засерать глобальную область переменными
(function(){
    // коллекция элементов-регионов
    var options = document.querySelectorAll('a');
    // обработчик события click
    var onclick = function() {
        // обработчик вызывается в контексте элемента, на котором он зарегистрирован, то есть this указывает на сам элемент
        var id = this.getAttribute('id');
        // создаем объект для ajax-запроса
        var request = new XMLHttpRequest();
        // настраиваем на GET-запрос
        request.open('GET', '/pop.php?loc=' + id);
        // навешиваем обработчик "смены состояний". тут бы лучше подошел обработчик onload, но у него проблемы с кроссбраузерностью
        request.onreadystatechange = function() {
            // ожидаем завершения запроса
            // 4 - это значение константы request.DONE, означающей, что запрос завершен. опять же, в IE8 константы этой нет, так что пишем тупо четверку
            if (this.readyState != 4)
                return;
            // сервак должен ответить 200 OK, иначе считаем за ошибку
            if (this.status !== 200)
                return alert('Ошибка при запросе!');
            // парсим JSON-ответ. Может бросить исключение при невалидном значении.
            var data = JSON.parse(this.responseText);
            // если ок, то перезагружаем страницу
            if (data.ok)
                location.reload();
        };
        request.send(null);
    };
    for (var i = 0; i < options.length; i++) {
        // вешаем обработчик события click на все элементы
        options[i].onclick = onclick;
    }
})();

с js у меня большие проблемы

К каждой строчки добавил комментарии. Спрашивай че не понятно.

Да, поменяй id на data-id, и в строчке с getAttribute соответственно тоже.

[wisma]

Сайт на джумле чтоли? Выкинь нафиг jQuery - глупо юзать библиотеку из 10000 строк ради пары функций..

К каждой строчки добавил комментарии. Спрашивай че не понятно.

Да, поменяй id на data-id, и в строчке с getAttribute соответственно тоже.

да, на жумле + вирт 1.1.9, реализировали давным давно выбор регионов с наценками, вот нужно переделать теперь в карту Украины (дивами сделаю..)
---
Сейчас попробую и отпишусь!) Спасибо!)

[wisma]

danik.js, Спасибо!) Все отлично работает(правда я не менял на data-id, это обязательно?), теперь остается только оформить карту как нужно.

Еще маленький вопросик, раньше перевыбор осуществлялся по такому принцыпу

<div class="logo4"><a style="color: #C5C5C4;text-decoration: none !important;" href="javascript:reselects();return false;" onclick="reselects();return false;">Выберите ваш регион:</a><br>Украина:<br> <?=@$rlsloc?> 
  </div>

Как сейчас снова вызвать это окошко чтобы перевыбрать регион? можно даже кнопкой [изменить], меня интересует просто сайт js код...

---
Беда теперь все ссылки (по всему сайту) реагируют так-же, нужно чтобы именно в этом блоке, заранее спасибо!

P.S. Ссылка на тестовый поддомен на основном домене стоит старая версия без ваших поправок

[danik.js]

Ссылка на тестовый поддомен

Трындец нафиг!!!! Три!!! Три штуки jQuery на одной странице!
Ужасть!!! Там вобще капут че творится. Мой совет - найми нормального спеца, пусть приводит все в порядок.

[danik.js]

теперь все ссылки (по всему сайту) реагируют так-же,

Используй более специфический селектор в querySelectorAll, чтобы выборка шла только из нужных ссылок, а не всех подряд.
И в конце обработчика onclick нужно добавить return false, чтобы отменить действие по умолчанию (переход по ссылке #)

[wisma]

danik.js, заменил ссылки на

<a class="reg" data-id="0"

Поставил:

// коллекция элементов-регионов
    var options = document.querySelectorAll('a.reg');

options[i].onclick = return false;

перестало выбиратся, что я опять сделал не так?

[danik.js]

data-id

Там где getAttribute тоже изменил на data-id?

options[i].onclick = return false;

Хех, видимо ты и вправду с js не дружишь.

Я же в комментариях подписал функцию-обработчик.
Вот в конце функции (сразу после request.send() ) и нужно написать return false. То есть функция onclick будет возвращать false, что браузер расценит как необходимость отмены действия по умолчанию (перехода по ссылке)

[wisma]

danik.js, получилось!) Спасибо огромное!)

[danik.js]

Три!!! Три штуки jQuery на одной странице!
Ужасть!!! Там вобще капут че творится.

Это как-нибудь прокомментируешь? Сайт ведь реально долго открывается.. Да и шанс чему-нибудь отвалиться увеличиватся.