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);
        }
    });
}
时间: 2024-10-05 18:09:31

jquery 展开收缩table的相关文章

jquery展开收缩

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>jquery展开.收缩</title>

jquery实现后台系统左侧菜单的点击展开/收缩二级菜单效果

html: <div class="col-sm-3 col-md-2 sidebar"> <div class="totalt"><a>系统管理系统</a></div> <ul class="menu"> <li class="title"> <a class="item item1"><span cla

Jquery div展开收缩

1 <html> 2 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 3 <head> 4 <script type="text/javascript" src="js/jquery1.3.2.js"></script> 5 <script type="tex

jQuery实现收缩展开左边栏

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx.cs" Inherits="Frame_Index" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server&quo

jQuery弹性展开收缩菜单插件gooey.js

分享一款基于jQuery弹性展开收缩菜单插件gooey.js.这是一款基于gooey.js插件实现的弹性菜单特效代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <header class="plugin-demo-header"> <h1>Gooey Menu</h1> <nav id="gooey-upper"> <input type="checkbox" cla

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

html主题代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="

SlickGrid example 5:带子项的展开收缩

带子项的展开收缩. 代码: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>SlickGrid example 5: Collapsing</title> <link rel="stylesheet"

WordPress文章页添加展开/收缩功能

很多时候我们在WordPress上发布一些文章的时候里面都包含了很多的代码,我一般又不喜欢把代码压缩起来而喜欢让代码格式化显示,但是格式化显示通常会让文章内容看起来很多,不便于访问者浏览,所以今天就介绍一种可以展开/收缩文章内容的功能. 方法: 1.在header.php中添加下面的代码,或者也可以单独写进一个js文件中然后在header.php中引入也可以.我是引入的. 1 2 3 4 5 6 7 <script type="text/javascript">     j

Android开发之自定义View-可动画展开收缩View的实现

有时候需要点击一个view可以动画展开和收缩折叠一个View这样的效果,这样就可以直接自定义View来实现. 本例中,采用继承FrameLayout来实现自定义的ExpandView.下面将详细介绍各个部分来实现该类以及如何使用该自定义视图. 效果图如下: 未展开效果: 正在向上折叠收缩中的效果: 已经展开效果: 自定义展开类:ExpandView的实现: package com.czm.customview; import android.content.Context; import and