Как передать параметр в url по клику?

273
04 января 2018, 21:52

Ребята, помогите плиз. Мне нужно передавать параметры в url по клику на каждую ссылку. Передать получилось, а вот заменить параметр по клику на другую ссылку, без перезагрузки страницы, не пойму как реализовать. Сейчас вообще кажется, что не тем путем пошел. Не судите строго ;)

$(document).ready(function () { 
    var accordionTitle = $('.catalog__accordion-title'); 
    var accordionSubTitle = $('.catalog__accordion-item'); 
 
    accordionTitle.click(function () { 
 
        $(".catalog__accordion .catalog__accordion-title").removeClass("active"); 
        $(".catalog__accordion .catalog__accordion-open").removeClass("show"); 
 
        $(this).addClass("active"); 
        $(this).next().addClass('show');//добавляем класс текущей (нажатой) 
 
    }); 
 
    accordionSubTitle.click(function () { 
 
        $(".catalog__accordion .catalog__accordion-item").removeClass("active"); 
 
        $(this).addClass('active'); 
 
        var $title = '#ct=' + $(this).parent().prev().data('title'); 
 
        var $subTitle = '&sub_ct=' + $(this).data('sub-title'); 
        var linkCollectionItemPage = $title + $subTitle; 
 
        window.location.href += linkCollectionItemPage; 
         
    }); 
});
.catalog__accordion-open { 
  display:none; 
} 
.catalog__accordion-open.show{ 
  display:block; 
} 
.catalog__accordion-content { 
  display: flex; 
  flex-direction: column; 
} 
 
.catalog__accordion-title{ 
  padding: 10px 0; 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="catalog__accordion"> 
              <div class="catalog__accordion-head"> 
                <h3>Наша Продукция</h3> 
              </div> 
              <div class="catalog__accordion-content"> 
                <a class="catalog__accordion-title" href="javascript:void(0);" data-title="1">Комплексные трансформаторные подстанции</a> 
                <div class="catalog__accordion-open"> 
                  <a class="catalog__accordion-item" href="javascript:void(0);" data-sub-title="1">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0);" data-sub-title="2">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0);" data-sub-title="3">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0);" data-sub-title="4">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                </div> 
                <a class="catalog__accordion-title" href="javascript:void(0);" data-title="2">Комплексные трансформаторные подстанции</a> 
                <div class="catalog__accordion-open"> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="1">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="2">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="3">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="4">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                </div> 
                <a class="catalog__accordion-title" href="javascript:void(0);" data-title="3">Комплексные трансформаторные подстанции</a> 
                <div class="catalog__accordion-open"> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="1">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="2">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="3">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="4">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                </div> 
                <a class="catalog__accordion-title" href="javascript:void(0);" data-title="4">Комплексные трансформаторные подстанции</a> 
                <div class="catalog__accordion-open"> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="1">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="2">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="3">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="4">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                </div> 
                <a class="catalog__accordion-title" href="javascript:void(0);" data-title="5">Комплексные трансформаторные подстанции</a> 
                <div class="catalog__accordion-open"> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="1">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="2">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="3">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  <a class="catalog__accordion-item" href="javascript:void(0)" data-sub-title="4">Комплектные транчформаторные подстанции тупикового типа мачтовые КТПм (LE-ТПМ)</a> 
                  </div> 
              </div> 
            </div>

Answer 1

Мне кажется вам нужно убрать + из это строчки:

window.location.href += linkCollectionItemPage;
READ ALSO
ScrollTop работает некорректно

ScrollTop работает некорректно

Когда прокручиваю страницу, то animate не запускаетсяНо стоит обновить страницу на отметке в 500px и ниже, как скрипт начинает работу

234
Две таблицы с выбором опций, между ними HTML

Две таблицы с выбором опций, между ними HTML

Нужно просто сверстать две табличкиВ Таблице 1 будут находится какие-нибудь значения: к примеру Значение 1, Значение 2, Значение 3 и т

249
Сложение столбцов [требует правки]

Сложение столбцов [требует правки]

Если другие варианты получение суммы столбцов? Нежели этот

244