如何使用JQuery"toggle"有参数吗? [英] how to use JQuery "toggle" with parameters?

问题描述

我有一个这样的表:

<table>
  <tr>
    <td><input type="button" title="Toggle" value="Show" id="btn534534" class="toggle" />    </td>
    <td>some data about ID 534534</td>
  </tr>
  <tr id="row534534" class="hiddenRow">
    <td colspan="2">some hidden data about ID 534534 that must show/hide with toggle</td>
  </tr>
  <tr>
    <td><input type="button" title="Toggle" value="Show" id="btn2423434" class="toggle" /></td>
    <td>some data about ID 2423434</td>
  </tr>
  <tr id="row2423434" class="hiddenRow">
    <td colspan="2">some hidden data about ID 2423434that must show/hide with toggle</td>
  </tr>
  <!-- many more rows here -->
</table>

像上面一样，有许多行集合".对于每组行"，表的一行都是可见的. JQuery会在页面加载时隐藏类"hiddenRow"的第二行，如下所示:

There are MANY "sets" of rows like the above. One row of the table is visible for each "set" of rows. The second row with class "hiddenRow" is hidden on page load by JQuery like this:

$("tr.hiddenRow").hide();

现在，我希望每个按钮都可以在其后立即切换行的可见性.请注意，可见行中的INPUT和隐藏行的TR共享唯一的ID.我想让按钮onclick调用JQuery函数并传递ID，以便JQuery知道要切换的行.

Now I want each button to toggle visibility of the row immediately after it. Note that the INPUT in the visible row, and the TR of the hidden row share a unique ID. I want to have the button onclick call a JQuery function and pass the ID so that JQuery knows which row to toggle.

有什么想法吗?我在网上找不到任何示例.

Any ideas? I can't find any examples of this online.

推荐答案

这应该可以解决问题:

$(document).ready(function() {
    $(".toggle").click(function() {
        $(this).closest('tr').next('tr.hiddenRow').toggle(); 
    });
});

http://jsfiddle.net/DU8rd/1 (感谢 注意:这不会传递您所指示的ID，但会创建您描述的行为.

Note: This doesn't pass the ID as you indicated, but it does create the behavior you described.

这篇关于如何使用JQuery"toggle"有参数吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！