|
Переход по ссылке при клике на id блока
Всем доброго дня.
Есть функция window.onload = function () { var a = document.getElementById('idglub1'); a.onclick = function() { document.location.href = 'Ссылка' } } Все работает до того времени, пока я не вставляю еще одну но с другой ссылкой, замена имен переменных не помогает. Полный профан в JS... Как сделать так чтобы все работала например при 20 разных id блоков. Спасибо |
artemii,
Можно добавить пример html с разными блоками и пример скрипта с попыткой обработки кликов на разных блоках? |
Страничка на которой размещены блоки и скрипт https://vk.cc/8hHO5q
Блоки при клике на которые должны быть переходы - обрамлены рамкой, с анимацией. Айдишники idglub1 , idglub2 и так далее |
artemii,
Просьба была насчет маленького примера html и маленького скрипта, на которых была бы видна проблема, а не целого сайта, на котором непросто найти нужное. Что-то там не видно таких айдишников |
Увы это вп, не могу вычленить кусок хтмл, ничего не будет понятно по нему)
айдишники по поиску бьются, все ок Скрипт выше - это целый, не кусок |
https://zaogss.ru/glub/:213:</header><!-- header --> <div class="realfactory-page-wrapper" id="realfactory-page-wrapper" ><div class="gdlr-core-page-builder-body"><div class="gdlr-core-pbf-wrapper " ><div class="gdlr-core-pbf-wrapper-content gdlr-core-js " ><div class="gdlr-core-pbf-wrapper-container clearfix gdlr-core-container" ><div class="gdlr-core-pbf-element" ><div class="gdlr-core-title-item gdlr-core-item-pdb clearfix gdlr-core-left-align gdlr-core-title-item-caption-top gdlr-core-item-pdlr" ><span class="gdlr-core-title-item-caption gdlr-core-info-font gdlr-core-skin-caption" >Выполненные работы</span><div class="gdlr-core-title-item-title-wrap " ><h3 class="gdlr-core-title-item-title gdlr-core-skin-title" >Глубинное водопонижение</h3></div></div></div><div class="gdlr-core-pbf-element" ><div class="gdlr-core-divider-item gdlr-core-item-pdlr gdlr-core-item-pdb gdlr-core-divider-item-normal" ><div class="gdlr-core-divider-line gdlr-core-skin-divider" style="border-color: #00517c;" ></div></div></div><div class="gdlr-core-pbf-column gdlr-core-column-20 gdlr-core-column-first" id="idglub1" ><div class="gdlr-core-pbf-column-content-margin gdlr-core-js skill_block" ><div class="gdlr-core-pbf-background-frame" style="margin: 3px 15px 15px 15px;border-width: 3px 3px 3px 3px;border-style: solid;border-color: #d6d6d6;" ></div><div class="gdlr-core-pbf-column-content clearfix gdlr-core-js " ><div class="gdlr-core-pbf-element" ><div class="gdlr-core-image-item gdlr-core-item-pdlr gdlr-core-item-pdb gdlr-core-center-align" ><div class="gdlr-core-image-item-wrap gdlr-core-media-image gdlr-core-image-item-style-rectangle" style="border-width: 0px;" ><a href="/bolshaya-pochtovaya/" target="_self" ><img src="https://zaogss.ru/wp-content/uploads/2018/04/igly.bol_.pocht_.6-800x420.jpg" alt="" width="800" height="420" /><span class="gdlr-core-image-overlay " style="background: rgba(0, 81, 124, 0.6);" ><i class="gdlr-core-image-overlay-icon fa fa-link gdlr-core-size-22" ></i></span></a></div></div></div><div class="gdlr-core-pbf-element" ><div class="gdlr-core-title-item gdlr-core-item-pdb clearfix gdlr-core-center-align gdlr-core-title-item-caption-top gdlr-core-item-pdlr" style="padding-bottom: 20px;" ><div class="gdlr-core-title-item-title-wrap " ><h3 class="gdlr-core-title-item-title gdlr-core-skin-title" style="font-size: 20px;font-weight: 500;letter-spacing: 0px;text-transform: none;" ><a href="/bolshaya-pochtovaya/" target="_self" >Большая Почтовая</a></h3></div></div></div><div class="gdlr-core-pbf-element" ><div class="gdlr-core-text-box-item gdlr-core-item-pdlr gdlr-core-item-pdb gdlr-core-center-align" ><div class="gdlr-core-text-box-item-content" style="font-size: 16px;" ><p>Объект: «Многофункциональный жилой комплекс» 1-я очередь, расположенном по адресу: г. Москва, ул. Большая Почтовая, вл.24,30, 34.»</p> |
Вот пример 1го блока.
Как быть с 1м - понятно, скрипт работает корректно при 1й ссылке. Но когда нужно чтобы было больше 2х ссылок - не пашет( |
Небольшой макет
<style> div {width:20px; height:20px; background:gray; border:1px solid black;} </style> <div id = "idglub1"></div> <div id = "idglub2"></div> <div id = "idglub3"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $("div[id*=idglub]").on('click', function(){ alert(this.id); }); </script> |
artemii,
вы блок добавляете, а обработчик один? |
Спасибо, но я не понял как сделать так, чтобы при клике на idglub1 был переход на ссылку1, а при клике на idglub2 был переход на ссылку2...
|
Часовой пояс GMT +3, время: 19:41. |
|