Question

我正在尝试使用jQuery隐藏某些内容并在表格中显示表单，但是现在我隐藏或显示了自定义标签上的所有内容。我如何才能使该脚本仅定位可提供给这些标签的ID？

$(document).ready(function() {
  $(".hide").click(function() {
    $("p").hide(100);
    $("z").show(100);
  });
  $(".show").click(function() {
    $("p").show(100);
    $("z").hide(100);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table class="table table-bordered">
  <th>début vacance</th>
  <th>fin vacance</th>
  <th>supprimer vacances</th>
  <tr th:each="vacations : ${selectedUser.getVacations()}">
    <td th:utext="${vacations.getStartVacation()} ">...</td>
    <td th:utext="${vacations.getEndVacation()} + ${vacations.id}">...</td>
    <td>
      <p th:text="${vacation.fistname}">...</p>
      <z th:text="${vacations.id}">...</z>
      <button class="hide">Hide</button>
      <button class="show">Show</button>
    </td>
</table>

Answer 1

尝试这样。这将检查最近的父tr并在其中找到p或z。如果您还为p添加了多个容器，则在任何情况下都不会失败

  <script>
      $(document).ready(function(){
          $(".hide").click(function(){
              $(this).parents('tr').find("p").hide(100);
              $(this).parents('tr').find("z").show(100);
          });
          $(".show").click(function(){
              $(this).parents('tr').find("p").show(100);
              $(this).parents('tr').find("z").hide(100);
          });
      });
  </script>

希望这会有所帮助

Answer 2

由于按钮和library("rCharts") xPlot(time_series~time, group="stock",data=df,type="line-dotted")和p标签是兄弟姐妹，因此您可以执行以下操作将操作范围限制为当前z：

td

如何使用jQuery脚本定位特定的自定义html标签

2 个答案: