当使用 Javascript 单击按钮或图像时，表列折叠

Table columns collapsed when button or image clicked using Javascript

本文关键字：折叠 图像 Javascript 单击 按钮      更新时间：2023-09-26

我有这个函数，它负责使表格tr和th折叠。我想在单击按钮时折叠表格列。我想因为我正在使用$('tr th'),click(function()所以当我单击th中的任何位置时，它正在折叠。当我们像这样单击按钮或图像时，我想折叠(function myFunction(){}).

这是我的代码：

$(window).load(function(){
$(function() {
    $('table tbody tr:odd').addClass('alt');
    $('table tbody tr').hover(function() {
        $(this).addClass('hover');
    }, function() {
        $(this).removeClass('hover');
    });
});
$('tr th:not(:eq(0),:eq(1),:eq(2),:eq(3),:eq(4),:eq(5))').click(function() {
    var index = (this.cellIndex + 1);
    var cells = $('table tr > :nth-child(' + index + ')');
    cells.toggleClass('collapsed');
    if ($(this).hasClass('collapsed')) {
        $(this).find('span').html('<b>+</b>');
    }
    else {
        $(this).find('span').html('<b>-</b>');
    }
    if ($('table tr > th:not(.collapsed)').length)
        $('table').removeClass('collapsed');
    else
        $('table').addClass('collapsed');
});
});

为什么不添加一个onclick事件，而不是使用jquery添加一个点击侦听器。
你可以做这样的事情

<button type="button" onclick="toggleExpand('anyReqParam1', 'anyReqParam2')" class="toggle"></button>

并在脚本中定义函数

<script>
  function toggleExpand(anyReqParam1, anyReqParam2) {
     // toggle code goes here
  }
</script>

或者你也可以做

$(".toggle").click(function() {
});

使用 JQuery。这里的切换是我给按钮的类名

相关文章：