JQuery удалить или добавить стиль к последнему элементу определенного типа - PullRequest
Новая
       14

JQuery удалить или добавить стиль к последнему элементу определенного типа

0 голосов
/ 07 ноября 2018

У меня есть страница jQuery, в которой происходит несколько вещей. Все функции завершены. Единственное, что не завершено - это удалить последние часы (только последние) каждой таблицы. Мне нужно знать, как последний из определенного типа элемента в массиве. Все элементы, которые заключены в таблицы, являются их собственным массивом. Мне нужно перебрать каждую из этих таблиц и удалить только последние часы в таблице для каждой таблицы. Я перепробовал много методов и не могу это понять. Приведенный ниже код удаляет только последний час для последней таблицы. Это не завершает мою задачу.

jQuery / JavaScript Code (все работает, кроме удаления последнего HR) 

<script>
$(document).ready(function(){
  var H2SingerTitles = $("h2.toggleSinger");
  for (i = 2; i < H2SingerTitles.length; i++) {
    var currentH2Singer = H2SingerTitles[i];
    var siblingsofH2Singer = 
    $(currentH2Singer).nextUntil("h2.toggleSinger");
    $(siblingsofH2Singer).wrapAll("<table></table>");
    for (j = 0; j < siblingsofH2Singer.length; j++) {
      $("hr").last().css("border-top", "none");
    } // line ends for loop with j counter
  } // line ends for loop with i counter 
  togglerHeaders.slice(0,2).removeClass("toggleSinger");
  $(".toggleSinger").next().hide();
  $(".toggleSinger").click(function(){
    $(".toggleSinger").next().toggleClass();
  });
}); 
</script>

Внутренний цикл (который приведен ниже) - это то, что я пытаюсь использовать, чтобы циклически проходить по таблицам, а затем удалять только последний HR в таблице. По какой-то причине это не работает. 

for (j = 0; j < siblingsofH2Singer.length; j++) {
  $("hr").last().css("border-top", "none");
} // line ends for loop with j counter

Ниже мой HTML 

<div id="mainPage">
  <h2 class=""><span class="title">Whitney Houston</span></h2>
  <div class="aboutInfo">
    <img src="whitney_houston.jpg" height="150">
    <a href="www.whitneyhouston.com" target="_blank"><h3><em>The Voice</em> 
    </h3></a>
    <h3>Worldwide Famous Vocalist, Singer and Performer</h3> 
    <p>I will always love you</p>
    <br>
    <hr>
  </div> 

  <h2 class=""><span class="title">Mariah Carey</span></h2>
  <div class="aboutInfo">
    <img src="mariah_carey.jpg" height="150">
    <a href="www.mariahcarey.com" target="_blank"><h3><em>Whistle 
    Register</em></h3></a>
    <h3>Worldwide Famous Vocalist, Singer and Performer</h3> 
    <p>Hero</p>
    <br>
    <hr>
  </div>

  <h2 class="toggleSinger"><span class="title">Michael Jackson</span></h2>
  <table style="display: none;">
    <div class="aboutInfo">
      <img src="michael_jackson.jpg" height="150">
      <a href="www.michaeljackson.com" target="_blank"><h3><em>King of
      Pop</em></h3></a>
      <h3>Worldwide Superstar Singer, Dancer and Performer</h3> 
      <p>Billie Jean</p>
      <br>
      <hr>
    </div>
    <div class="aboutInfo">
      <img src="jackson_5.jpg" height="150">
      <a href="www.jackson5.com" target="_blank"><h3><em>The Jackson 5</em> 
      </h3></a>
      <h3>Worldwide Famous R and B Group</h3> 
      <p>ABC</p>
      <br>
      <hr>
    </div>
  </table>

  <h2 class="toggleSinger"><span class="title">Diana Ross</span></h2>
  <table style="display: none;">
    <div class="aboutInfo">
      <img src="diana_ross.jpg" height="150">
      <a href="www.dianaross.com" target="_blank"><h3><em>The Original 
      Diva</em></h3></a>
      <h3>Worldwide Superstar Singer</h3> 
      <p>I'm coming out</p>
      <br>
      <hr>
    </div>
    <div class="aboutInfo">
      <img src="diana_ross.jpg" height="150">
      <a href="www.dianaross.com" target="_blank"><h3><em>The Supremes</em> 
      </h3></a>
      <h3>Worldwide Famous Girl Group</h3> 
      <p>Stop in the name of love</p>
      <br>
      <hr>
    </div>
  </table>

  <h2 class="toggleSinger"><span class="title">Lionel Richie</span></h2>
  <table style="display: none;">
    <div class="aboutInfo">
      <img src="lionel_richie.jpg" height="150">
      <a href="www.lionelrichie.com" target="_blank"><h3><em></em></h3></a>
      <h3>Worldwide Superstar Singer and Pianist</h3> 
      <p>All night long</p>
      <br>
      <hr>
    </div>
    <div class="aboutInfo">
      <img src="diana_ross.jpg" height="150">
      <a href="www.dianaross.com" target="_blank"><h3><em>The Commodores</em> 
      </h3></a>
      <h3>Worldwide Famous Group and Band</h3> 
      <p>Brickhouse</p>
      <br>
      <hr>
    </div>
  </table>

  <h2 class="toggleSinger"><span class="title">Smokey Robinson</span></h2>
  <table style="display: none;">
    <div class="aboutInfo">
      <img src="smokey_robinson.jpg" height="150">
      <a href="www.smokeyrobinson.com" target="_blank"><h3><em></em></h3></a>
      <h3>Worldwide Singer and Songwriter</h3> 
      <p>Cruising</p>
      <br>
      <hr>
    </div>
    <div class="aboutInfo">
      <img src="the_miracles.jpg" height="150">
      <a href="www.themiracles.com" target="_blank"><h3><em>The Miracles</em> 
      </h3></a>
      <h3>Worldwide Famous R and B Group</h3> 
      <p>Ooh Baby Baby</p>
      <br>
      <hr>
    </div>
  </table>
</div>

1 Ответ

0 голосов
/ 07 ноября 2018

Если вы пытаетесь удалить последний HR на каждой таблице, в которой вам не нужен цикл for, попробуйте это. 

$("table").each(function(){ $(this).find("hr").last().remove(); });
...