javascript - 如何让这个脚本执行其他功能

标签 javascript jquery

我最近发现了这个带有 Jquery 的可扩展表,它是非常轻量级且很棒的代码。但是,我需要对其进行一些小的更改,但我不知道如何进行。如果你看一下这个demo当您从第一行单击到第二行、第三行、第四行……依此类推。该行继续扩展,相反,我需要收缩不活动的行。这意味着,当用户从点击第一行转到第二行时,前一行会收缩。

我希望它很清楚,我会提供代码,但你可以看到源代码,它很整洁并且 Here是完整的教程。

谢谢。

好的,这是 Jsfiddle 中的代码:

    $(document).ready(function(){
        $("#report tr:odd").addClass("odd");
        $("#report tr:not(.odd)").hide();
        $("#report tr:first-child").show();

        $("#report tr.odd").click(function(){
            $(this).next("tr").toggle();
            $(this).find(".arrow").toggleClass("up");
        });
        //$("#report").jExpand();
    });

最佳答案

将您的点击处理程序更改为此,这会在展开所选处理程序之前收缩所有内容:

$("#report tr.odd").click(function() {
    if ($(this).next("tr").is(":visible")) {
        $(this).next("tr").hide();
        $(this).find(".arrow").removeClass("up");
    } else {
        $("#report tr:not(.odd)").hide();
        $(".arrow").removeClass("up");
        $(this).next("tr").show();
        $(this).find(".arrow").addClass("up");
    }
});

参见fiddle

关于javascript - 如何让这个脚本执行其他功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13542405/

相关文章:

javascript - 使用 Polymer 在元素上设置属性会出现错误 "Cannot set property ' .. .' of undefined'

javascript - 如何在javascript中获取正方形边缘附近的随机点

javascript - react js Formik <Form/> resetForm() 不工作

JAVASCRIPTscrollLeft平滑滚动而不跳跃

javascript - AngularJS 指令从 templateUrl 检索模板时出现问题

javascript - Webcodecamjs-二维码扫描库在 Safari 浏览器中无法工作

javascript - 事件绑定(bind)是什么意思?

javascript - 使用 id 中的点击的 Jquery Dynatree 插件

javascript - 无法读取 null 的属性 'push'