Как сделать div кликабельным? - PullRequest
7 голосов
/ 21 мая 2010

Я хочу сделать этот div клик-совместимым и хочу использовать те же href изнутри <a> и хочу также сохранить ссылку внутри <a> (поэтому, если JS отключен, ссылка будет доступна).

<div id="example">

<p> some text </p>

<img src="example.jpg />

<a href="http://stackoverflow.com"> link </link>

</div>

Я имею в виду, мне нужно вот так.

<div id="example" href="http://stackoverflow.com">

<p> some text </p>

<img src="example.jpg />

<a href="http://stackoverflow.com"> link </link>

</div>

Ответы [ 4 ]

7 голосов
/ 21 мая 2010

Нечто подобное должно делать

$('#example').click(function() {
  window.location.href = $('a', this).attr('href');
});
3 голосов
/ 21 мая 2010

Я пока не могу ответить на вышеупомянутый разговор, потому что я новичок здесь, но я просто хотел сказать, что вам не нужно return false от этой функции. Это предотвращает поведение события по умолчанию (что в случае нажатия div - ничто) и предотвращает распространение события до следующего элемента в иерархии DOM.

Вряд ли что-то из этого необходимо для этого случая. Кроме того, если вам действительно нужно это поведение, вы можете получить его отдельно и более четко так:

// note that the function will be passed an event object as
// its first argument.
$('#example').click(function(event) { 
  event.preventDefault(); // the first effect
  event.stopPropagation(); // the second

  window.location.href = $('a', this).attr('href');
});

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

2 голосов
/ 09 ноября 2011
<html>  
  <body>
    <div onclick="window.location.href = this.getElementsByTagName('a')[0].href;">
      <p>some text</p>      
      <a href="http://www.google.co.in/">link</a>
    </div>
  </body>
</html>
0 голосов
/ 11 ноября 2011

Все ответы выше приняты мной. И вообще вы можете сделать то же самое или даже более великим эффект "div", чем "a" css. И вы можете добавить функцию JS, чтобы показать изменения CSS, когда событие произошло, как Click. Может быть так: DIV.onclick = function () {измените целевой объект dom здесь}。 затем, когда произойдет событие, вы увидите эффект. и если вы хотите изменить HREF на другой. напишите js как location.href = "http://www.target.com"; это будет работать для вас.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...