在jquery中获取上一个事件动作

Question

我正在尝试使用 jquery 获取上一个事件操作

<tr id="det"><td></td></tr>
<tr id="moredet"><td></td></tr>
<tr id="det"><td></td></tr>

$(document).on("click","#det",function(e){
    $(this).next("#moredet").fadeToggle("slow");
});

我想要的是，当单击 id 行“det”时，单击的下一个 id 行“moredet”将变为淡出，当我单击任何其他行 id“det”时，前一个淡入行行将淡出并且单击行的下一行 id "moredet" 将淡入。

Answer 1

不要使用重复的 id 使用类。它的规则违反。您可以使用next 和prev 和size 来检查条件以解决您的问题。

$(document).on("click", ".det", function(e) {
  if ($(this).next('tr').size() > 0) {
    $(this).next(".moredet").fadeToggle("slow");
  } else {
    $(this).prev(".moredet").fadeToggle("slow");
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr class="det">
    <td>1</td>
  </tr>
  <tr class="moredet">
    <td>2</td>
  </tr>
  <tr class="det">
    <td>3</td>
  </tr>
</table>