jQuery最近/父不工作

Question

此代码出了什么问题？点击

没有任何反应

HTML

  <p>Click me</p>
    <h1 class="myClass">...........</h1>

  <p>Click me</p>
    <h1 class="myClass">-----------</h1>

CSS

hilight {
    background-color: yellow;
  }

的jQuery

$( document ).on( "click", "p", function( ) {
  $( this ).closest( ".myClass" ).toggleClass( "hilight" );
});

实例 https://jsfiddle.net/djuccj7b/

Answer 1

您可以使用设置为this：p元素Next Adjacent Selector ("prev + next")的context来选择h1元素，该元素是所点击的{{1}的下一个元素兄弟元素

p

此外，在$( document ).on( "click", "p", function( ) { $( "+ .myClass", this ).toggleClass( "hilight" ); });

之前，css遗失了.

hilight

jsfiddle https://jsfiddle.net/djuccj7b/2/

Answer 2

1. 将最近的（）更改为下一个（）

2. 在css ....中将一个句点放在你的班级名称前面。

   .hilight {     背景颜色：黄色;   }