Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.02.2014, 04:47
Аспирант
Отправить личное сообщение для wisma Посмотреть профиль Найти все сообщения от wisma
 
Регистрация: 10.02.2014
Сообщений: 32

Помогите пож с JSON, передача id ссылки.
Здравствуйте, есть скрипт который передает параметры выбора опций 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 у меня большие проблемы( почитав кучу текста про это все ничему ненаучился и ничего у меня не вышло(, помогите пожалуйста.
Ответить с цитированием
  #2 (permalink)  
Старый 10.02.2014, 06:09
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от wisma
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;
    }
})();

Сообщение от wisma
с js у меня большие проблемы
К каждой строчки добавил комментарии. Спрашивай че не понятно.

Да, поменяй id на data-id, и в строчке с getAttribute соответственно тоже.
__________________
В личку только с интересными предложениями

Последний раз редактировалось danik.js, 10.02.2014 в 06:12.
Ответить с цитированием
  #3 (permalink)  
Старый 10.02.2014, 06:17
Аспирант
Отправить личное сообщение для wisma Посмотреть профиль Найти все сообщения от wisma
 
Регистрация: 10.02.2014
Сообщений: 32

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

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

Да, поменяй id на data-id, и в строчке с getAttribute соответственно тоже.
да, на жумле + вирт 1.1.9, реализировали давным давно выбор регионов с наценками, вот нужно переделать теперь в карту Украины (дивами сделаю..)
---
Сейчас попробую и отпишусь!) Спасибо!)
Ответить с цитированием
  #4 (permalink)  
Старый 10.02.2014, 06:28
Аспирант
Отправить личное сообщение для wisma Посмотреть профиль Найти все сообщения от wisma
 
Регистрация: 10.02.2014
Сообщений: 32

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. Ссылка на тестовый поддомен на основном домене стоит старая версия без ваших поправок

Последний раз редактировалось wisma, 10.02.2014 в 06:46.
Ответить с цитированием
  #5 (permalink)  
Старый 10.02.2014, 06:56
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от wisma
Ссылка на тестовый поддомен
Трындец нафиг!!!! Три!!! Три штуки jQuery на одной странице!
Ужасть!!! Там вобще капут че творится. Мой совет - найми нормального спеца, пусть приводит все в порядок.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #6 (permalink)  
Старый 10.02.2014, 06:58
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от wisma
теперь все ссылки (по всему сайту) реагируют так-же,
Используй более специфический селектор в querySelectorAll, чтобы выборка шла только из нужных ссылок, а не всех подряд.
И в конце обработчика onclick нужно добавить return false, чтобы отменить действие по умолчанию (переход по ссылке #)
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #7 (permalink)  
Старый 10.02.2014, 07:11
Аспирант
Отправить личное сообщение для wisma Посмотреть профиль Найти все сообщения от wisma
 
Регистрация: 10.02.2014
Сообщений: 32

danik.js, заменил ссылки на
<a class="reg" data-id="0"


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

options[i].onclick = return false;


перестало выбиратся, что я опять сделал не так?
Ответить с цитированием
  #8 (permalink)  
Старый 10.02.2014, 07:19
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от wisma
data-id
Там где getAttribute тоже изменил на data-id?
Сообщение от wisma
options[i].onclick = return false;
Хех, видимо ты и вправду с js не дружишь.

Я же в комментариях подписал функцию-обработчик.
Вот в конце функции (сразу после request.send() ) и нужно написать return false. То есть функция onclick будет возвращать false, что браузер расценит как необходимость отмены действия по умолчанию (перехода по ссылке)
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #9 (permalink)  
Старый 10.02.2014, 07:24
Аспирант
Отправить личное сообщение для wisma Посмотреть профиль Найти все сообщения от wisma
 
Регистрация: 10.02.2014
Сообщений: 32

danik.js, получилось!) Спасибо огромное!)
Ответить с цитированием
  #10 (permalink)  
Старый 10.02.2014, 07:26
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от danik.js
Три!!! Три штуки jQuery на одной странице!
Ужасть!!! Там вобще капут че творится.
Это как-нибудь прокомментируешь? Сайт ведь реально долго открывается.. Да и шанс чему-нибудь отвалиться увеличиватся.
__________________
В личку только с интересными предложениями
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите поменять адрес ссылки Kungan Общие вопросы Javascript 2 08.09.2013 00:50
построение Графика (передача переменной ajax json) Sadist_dead AJAX и COMET 10 13.08.2011 13:27
передача JSON на сервер mikeles AJAX и COMET 0 04.03.2011 11:28
ССЫЛКИ (Помогите новичку) meggen (X)HTML/CSS 8 30.11.2009 10:51
Помогите с формированием ссылки AnGor Общие вопросы Javascript 0 27.08.2008 17:53