Javascript 使用JQuery/Javascrpit动态更改表行

因此，我在JavaSpring中使用for循环创建了一个表，我想在单击按钮时打开和关闭部分表，这样一个超级简化的版本看起来像这样

<jsp:attribute name= "scripts">
       <script type="text/javascript">
        function togglet(){
            $('.wantTotoggleThis').toggle();
            $('.iWantToReplaceItWithThis').toggle();
        }
    </script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.iWantToReplaceItWithThis').hide();
        })
    </script>
</jsp:attribute>
<table>
<tbody>
    <c:foreach var = "whatever" items = "$list">
    <td class = "wantTotoggleThis"> Hello </td>
    <td class = "iWantToReplaceItWithThis"> Replaced </td>
    <a href="#" onclick="toggle()" >
</tbody>
</table>

函数togglet（）{
$（'.wanttogglethis'）.toggle（）；
$（'.i希望用this'）.toggle（）替换它；
}
$（文档）.ready（函数（）{
$（'.i希望用this'）.hide（）替换它；
})
你好
取代

---

我现在切换它们的方式是我只使用了一个切换函数，但回过头来看，表中的每个条目都被切换。我只希望能够切换单击按钮所在的行。

将元素传递到

onclick

中，以便可以从该元素进行遍历

<a href="#" onclick="toggle(this)" >

请注意，使用

onclick

是一种过时的做法，最好使用现代的不引人注目的事件侦听器

---

由于切换单个单元格，还将遇到时髦的表格布局。更改

可见性

可能是一种更好的方法

如果其他人对使用函数感兴趣，我还发现了另一种方法

function toggleSomething(element){
  var row = $(element).closest.('tr');
  row.find('.iwantTotoggleThis').toggle();
  row.find('.iWantToReplaceItWithThis').toggle();
 }

---

作品谢谢，是的，改变能见度效果更好！你用

java

标记它的目的是什么？

function toggleSomething(element){
  var row = $(element).closest.('tr');
  row.find('.iwantTotoggleThis').toggle();
  row.find('.iWantToReplaceItWithThis').toggle();
 }