8

私の質問は、特にhttp://api.jquery.com/event.target/#example-1を参照しています

<li>or other タグでスパンを使用して、ここ<b>で行ったようにスタイルを変更すると、要素のその部分は、JQuery 関数をトリガーしてその子を切り替えません。これを機能させるにはどうすればよいでしょうか？

HTML:

<ul>
    <li><b>This doesn't work,</b> this does
    <ul>
      <li>sub item 1-a</li>
      <li>sub item 1-b</li>
    </ul>
  </li>
  <li>item 2
    <ul>
      <li>sub item 2-a</li>
      <li>sub item 2-b</li>
    </ul>
  </li>
</ul>

JavaScript:

function handler(event) {
  var $target = $(event.target);
  if( $target.is("li") ) {
    $target.children("ul").toggle();
  }
}
$("ul").click(handler).find("ul").hide();
4

2 に答える 2

15

現在のフォームを使い続けるには、以下を使用することをお勧めしclosest()ます:

function handler(event) {
    $(event.target).closest('li').children("ul").toggle();
}
$("ul").click(handler).find("ul").hide();

JS フィドルのデモ。

私自身の使用のためには、私は好むでしょう：

$('li').on('click', function(e){
    e.stopPropagation();
    $(this).find('ul').toggle();
});

JS フィドルのデモ。

参考文献:

于 2013-07-19T23:07:07.263 に答える