Как запретить переход по ссылке при клике на определеный элемент внутри неё?

447
24 июля 2017, 14:45

В интернет магазине есть каталог товаров, каждый товар полностью оформлен в виде ссылки. Но внутри этого блока есть ещё и кнопки, как сделать чтобы при нажатии на кнопку внутри ссылки не происходило перехода?

Answer 1

Спасибо говорить @Grundy
В песочнице, что кликается, а что нет можно понять по консоли. Магия в event.stopPropagination

document.getElementById('123').onclick = worker; 
 
function worker(event) { 
  event.stopPropagation(); 
  // do your code here 
  console.log('button clicked'); 
} 
document.querySelector('a').onclick = worker2; 
 
function worker2() { 
  console.log('a clicked'); 
}
a div { 
  height: 100px; 
  width: 100px; 
  color: red; 
}
<a target="_blank" href='google.ru'> 
  <div>123</div> 
  <button id='123'>Моя кнопка</button> 
</a>

Answer 2

onclick="event.preventDefault()"

READ ALSO
Firefox 54.0 (64-бит) скрывает div с баннером [требует правки]

Firefox 54.0 (64-бит) скрывает div с баннером [требует правки]

Верстаю макет на локальном хостеНи одного js файла не подключено

240
Треугольник на css без заливки

Треугольник на css без заливки

Как сделать такой треугольник на css? При этом треугольник по высоте растянут, не равносторонний Посоветуйте, если эту стрелку нужно показывать...

444
Как создать такую таблицу?

Как создать такую таблицу?

Подскажите, как создать такую таблицу, приведённую на рисунке? В таблице разные по ширине колонки, и по разному прижат текст (влево, вправо,...

318