Как сделать полный DIV кликабельным с помощью якоря ... но внутри этого DIV есть кнопка ввода, которая не следует за этим якорем?

Question

Я пробовал это:

<div style="display:block;">
<a href="/go" style="display:block;height:100%;width:100%;position:absolute;"></a>
LOTS OF STUFF HERE 
<input type="button" onclick="runsomething();return false;">
</div>

Но это не работает. Он нажимает, чтобы следовать за якорем ... но кнопка также следует за якорем, чего я не хочу.

Редактировать: кнопка даже не щелкает. Это не будет давить! Это как Якорь полностью покрыл это.

Answer 1

Вы можете заставить событие прекратить распространение, нажав кнопку вверх, чтобы оно никогда не доходило до DIV.

$(".myDiv input").click(function(e){
  e.stopPropagation();
});

Для получения дополнительной информации о event.stopPropagation см. http://api.jquery.com/event.stopPropagation/

По какой-то причине ваш якорь занимает весь размер родительского контейнера.Зачем?Это закроет вашу кнопку, вероятно, сделав ее не блокируемой.Я понимаю, что вы хотели бы сделать весь DIV кликабельным, но это неправильный подход.Рассмотрим следующее:

$(".myDiv").click(function(){
  window.location = $("a:first", this).attr("href");
});

Это может привести к тому, что щелчок по этому DIV отправит пользователя туда, куда его ссылка отправила бы.Лучше всего то, что вам не нужно добавлять CSS к вашей ссылке или DIV.Javascript найдет ссылку в div, получит значение href и отправит пользователя в этом направлении.