jquery 展开收缩table

Posted 萧紫紫

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery 展开收缩table相关的知识,希望对你有一定的参考价值。

function zkss(objtd, tableid) {
  
    if ($(objtd).html() == "展开更多") {
        $("#" + tableid + " .changeTr").removeAttr("style");
            $(objtd).html("收缩");
        }
        else {
        $("#" + tableid + " .changeTr").css("display", "none");
            $(objtd).html("展开更多");
        }
   
}
//排行
function get_pl(tableid) {
    $("#"+tableid).html("");
    $.ajax({
        url: "ajax/userHandler.ashx",
        data: {
            type: tableid,
            rad: Math.random()
        },
        dataType: "json",
        success: function (data) {
            if (data.success == "1") {
                var item = "";
                var isyc = 0;
                $.each(data.data, function (k, dtRow) {
                    var mc = dtRow["name"];
                    var cs = dtRow["n"];
                    if (k < 3) {
                        item = item + "<tr ><td><span class=\"label label-warning\">" + (k + 1) + "</span></td><td>" + mc + "</td><td>" + cs + "</td></tr>";
                    } else {
                        if (k >= 10) {
                            isyc = 1;
                            item = item + " <tr style=\"display: none;\" class=\"changeTr\"><td><span class=\"label label-default\">" + (k + 1) + "</span></td><td>" + mc + "</td><td>" + cs + "</td></tr><tr> ";
                        }
                       else item = item + "<tr ><td><span class=\"label label-default\">" + (k + 1) + "</span></td><td>" + mc + "</td><td>" + cs + "</td></tr>";
                    }
                });

                if (isyc == 1) {

                    item = item + "   <tr> <td colspan=\"3\" onclick=\" zkss(this,‘" + tableid + "‘) \"  style=\"text-align:right\">展开更多</td> </tr>";
                }
                $("#" + tableid).html(item);
            }
            else {
                alert(data.data);
            }
            //点击tr 的时候,修改背景色
            changetrbk();

        },
        error: function (msg) {
            var description = "";
            for (var i in msg) {
                var property = msg[i];
                description += i + " = " + property + "\n";
            }
          //  debugger;
            alert("提交时发生系统发生错误" + description);
        }
    });
}

 

以上是关于jquery 展开收缩table的主要内容,如果未能解决你的问题,请参考以下文章

jquery实现可展开收缩的首页大图广告展示方式 泰山压顶代码js V2.0

jquery实现可展开收缩的首页大图广告展示方式 泰山压顶代码js V1.0

jquery 怎么实现展开和收起按钮之间的切换

jquery 怎么实现展开和收起按钮之间的切换

如何用jquery实现点击展开收缩效果

jquery 菜单展开与收缩参考脚本