0

次の HTML-Java コードがあります。

<div id="div_id" style="cursor: pointer;">
  <a id="a_id" href="...">...</a>

  <script type="text/javascript">
    $('#a_id').click(function(event) {
      event.preventDefault();
      alert('...');
    });
  </script>
</div>

<div id="details_id" style="display: none;">
  Some text to be displayed!

  <script type="text/javascript">
    $('#div_id').click(function(event) {
      event.preventDefault();
      $('#details_id').toggle();
    });
  </script>
</div>

（私のブラウザで）HTMLをクリックするとdiv#div_id、div#details_id. ただし、 HTML をクリックしたときにもトグルが発生しますa#a_id。HTML をクリックしたときa#a_idにdiv#details_id.

どうすればそれを作ることができますか？

4

2 に答える 2

2

ただ行う：

$('#div_id').click(function(event) {
    if (event.target != $('#a_id')[0]) {
      event.preventDefault();
      $('#details_id').toggle();
    }
});
于 2012-10-07T19:37:47.663 に答える
1

clickイベントが両方のハンドラーをトリガーするのを停止するには、要素でのイベントのバブリングを停止します。a

event.preventDefault();
event.stopPropagation();

またはより簡潔に：

// Your code

return false;

デモ: http://jsfiddle.net/jfzU2/2/

于 2012-10-07T19:37:43.980 に答える