Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> как заставить CHECKBOX модифицировать ссылку 
:(
    Опции темы
LIFTman
Дата 30.9.2013, 14:20 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 5
Регистрация: 3.8.2007

Репутация: нет
Всего: нет



Друзья, привет!

На сайте (wordpress) есть каталог ссылок, а вверху страницы чекбокс, активируя который, все ссылки должны при клике иметь дополнение в виде "http://translate.google.ru/"+собственно_ссылка


Код

<form name="red">
2        <input type="checkbox" id="translateCheckbox" name="translateCheckbox" checked="checked" />
3        </form>
4        <div id="menu">Каталог одежды
5        <a href="http://www.ebay.com/itm/ws/eBayISAPI.dll?ViewItem&item=390669025343" onclick="function();">Куртка</a>
6          </div>


Т.е. чекбокс активирован по умолчанию, при клике по ссылке некая функция должна препаривать текущую ссылку и добавлять при необходимости кусок с адресом гуглтранслейта, открывая ссылку в новом окне.

В процессе помогли таким кодом, но я не могу приделать его к ссылке

Код

    (function($) {
      var translateCheckbox = document.getElementById('translateCheckbox'),
        googleTranslateLink = 'your link here';
      $(document).on('click', 'a' function(){ //can be changed to more specific element
        if(translateCheckbox.checked) {
          window.location = googleTranslateLink + this.href;
          //return false; //may be useful in some cases
        }
      });
    })(jQuery);


нашел также такую версию, но для каждой ссылки прописывать столько кода - нереально утяжелит страницу.
Код

<a href="javascript://" onclick="if(document.forms['form_name'].elements['checkbox_name'].checked)window.location.href='pageA.html';else window.location.href='pageB.html'">



Подскажите, пожалуйста, как оптимизировать 
PM MAIL   Вверх
RBW
Дата 30.9.2013, 16:15 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 10
Регистрация: 29.9.2013

Репутация: нет
Всего: нет



1. Подключаешь  jQuery
2. Создаешь чекбокс, например
Код

<input type="checkbox" id="translate">

3. Вешаешь в js файл событие на клик
Код

$('#translate').on('click', function() {
    // то что мы добавляем к ссылке
    var prefix = 'http://ya.ru' 

    // Ситуация, когда поставили галочку в чекбоксе
    if ($(this).is(':checked') == true) {

        // Собираем все ссылки со страницы
        $.each($.find('a'), function() {
            // Это вариант если пути абсолютные т.е вида http://site.ru/query
            var url =  $(this).attr('href').replace('http://', '') 

            // Это вариант если пути начинаются со слэша т.е вида /query
            var url =  $(this).attr('href') 

            // Присваиваем ссылкам значение 
            $(this).attr('href', prefix + url)
        })
    }
    // Ситуация, когда галочку сняли
    else {
        // Собираем все ссылки со страницы
        $.each($.find('a'), function() {
            // Это вариант если пути начинаются со слэша т.е вида /query
            var url =  $(this).attr('href').replace(prefix, '') 
            
            // Присваиваем ссылкам значение 
            $(this).attr('href', url)
        })
    }
})


Тут живой пример: http://jsfiddle.net/w2ejm/
PM MAIL   Вверх
LIFTman
Дата 30.9.2013, 17:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 5
Регистрация: 3.8.2007

Репутация: нет
Всего: нет



Цитата(RBW @  30.9.2013,  16:15 Найти цитируемый пост)
Тут живой пример: http://jsfiddle.net/w2ejm/ 

живой пример работает, а вот реальный что-то не очень.
вроде подключил jQuery к вордпрессу,
в теле страницы пишу 

<script type="text/javascript" src="url.js"></script>  

<input type="checkbox" id="translate">
    <a href="/test/url1">Test 1</a>
    <a href="/test/url2">Test 2</a>

и все равно нифига :/
PM MAIL   Вверх
RBW
Дата 30.9.2013, 18:16 (ссылка) |    (голосов:1) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 10
Регистрация: 29.9.2013

Репутация: нет
Всего: нет



в url.js тебе еще надо  обернуть приведенный мной код в блок

Код

$.document.on('ready',  function() {

})


Это сообщение отредактировал(а) RBW - 30.9.2013, 18:16
PM MAIL   Вверх
LIFTman
Дата 2.10.2013, 08:03 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 5
Регистрация: 3.8.2007

Репутация: нет
Всего: нет



Цитата(RBW @ 30.9.2013,  16:15)


        // Собираем все ссылки со страницы
        $.each($.find('a'), function() {
            // Это вариант если пути абсолютные т.е вида http://site.ru/query
            var url =  $(this).attr('href').replace('http://', '') 

            // Это вариант если пути начинаются со слэша т.е вида /query
            var url =  $(this).attr('href') 

            // Присваиваем ссылкам значение 
            $(this).attr('href', prefix + url)
        })
    }
    // Ситуация, когда галочку сняли
    else {
        // Собираем все ссылки со страницы
        $.each($.find('a'), function() {
            // Это вариант если пути начинаются со слэша т.е вида /query
            var url =  $(this).attr('href').replace(prefix, '') 
            

А можно ли теперь как-то обрабатывать ссылки только определенного слоя страницы? а то меню сайта скриптом так же обрабатывается и сайт переводит сам себя smile я так понимаю ссылкам нужно дать некий айди и потом в скрипте искать не просто "а", а "а" + айди.
верно?
PM MAIL   Вверх
LIFTman
Дата 2.10.2013, 14:37 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 5
Регистрация: 3.8.2007

Репутация: нет
Всего: нет



UPD.
Вопрос закрыт. через селекторы все наладили, работает ок!

Всем спасибо!
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: для новичков | Следующая тема »


 




[ Время генерации скрипта: 0.0708 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.