javascript - 使用 Javascript 单击按钮或图像时表格列会折叠

Question

我有这个函数，它负责使表 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');
});
});

Answer 1

为什么不在按钮上添加 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。这里 toggle 是我为按钮指定的类名