• 技术文章 >web前端 >js教程

    javascript基于jQuery的表格悬停变色/恢复,表格点击变色/恢复,点击行选Checkbox_jquery

    2016-05-16 19:01:57原创894
    // 版本: 1.0
    // 日期: 2007/08/01
    // 备注: 需要jQuery库
    // 参考: Dodo(tableRowCheckboxToggle) 和 softcomplex(tigra_tables)

    function Kin_Tables(
    Kin_Table_GetTableMethod, //得到Table的方法 同$()功能 必选参数
    Kin_Table_Header_Offset, //从前起忽略多少行 可选参数
    Kin_Table_Footer_Offset, //从后起忽略多少行 可选参数
    Kin_Table_Odd_Style, //奇数行样式 可选参数
    Kin_Table_Even_Style, //偶数行样式 可选参数
    Kin_Table_Hover_Style, //鼠标悬停样式 可选参数
    Kin_Table_Click_Style //鼠标点击样式 可选参数
    ){

    $(function(){
    var Kin_Table_Config = [];
    Kin_Table_Config.GetTableMethod=(Kin_Table_GetTableMethod?Kin_Table_GetTableMethod:".Kin_Table");
    Kin_Table_Config.Header_Offset=(!isNaN(Kin_Table_Header_Offset)?Kin_Table_Header_Offset:0);
    Kin_Table_Config.Footer_Offset=(!isNaN(Kin_Table_Footer_Offset)?Kin_Table_Footer_Offset:0);
    Kin_Table_Config.Odd_Style=(Kin_Table_Odd_Style?Kin_Table_Odd_Style:"odd");
    Kin_Table_Config.Even_Style=(Kin_Table_Even_Style?Kin_Table_Even_Style:"even");
    Kin_Table_Config.Hover_Style=(Kin_Table_Hover_Style?Kin_Table_Hover_Style:"over");
    Kin_Table_Config.Click_Style=(Kin_Table_Click_Style?Kin_Table_Click_Style:"clicked");

    var Kin_Table = $(Kin_Table_Config.GetTableMethod+" tr:nth-child(n+"+eval(Kin_Table_Config.Header_Offset+1)+")");

    Kin_Table.each(function(i,row){
    if (i>=Kin_Table.length-Kin_Table_Config.Footer_Offset) return false;
    var Kin_Table_Row_Checkbox = $(row).find(":checkbox");
    bChecked = false;
    $(row).addClass(i%2==0?Kin_Table_Config.Odd_Style:Kin_Table_Config.Even_Style)
    $(row).hover(
    function(){$(this).addClass(Kin_Table_Config.Hover_Style);},
    function(){$(this).removeClass(Kin_Table_Config.Hover_Style);
    });
    $(row).click(function(){
    $(this).toggleClass(Kin_Table_Config.Click_Style);
    Kin_Table_Row_Checkbox.each(function(){
    this.checked=$(row).hasClass(Kin_Table_Config.Click_Style);
    });
    });
    Kin_Table_Row_Checkbox.each(function(){
    if(this.checked){
    bChecked = true;
    return false;
    }
    });
    if (bChecked) {
    $(row).addClass(Kin_Table_Config.Click_Style);
    Kin_Table_Row_Checkbox.each(function(){
    this.checked = true;
    });
    }else{
    $(row).removeClass(Kin_Table_Config.Click_Style);
    }
    });
    });
    }
    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    上一篇:js获取div高度的代码_javascript技巧 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • 一文聊聊Node多进程模型和项目部署• 聊聊怎么用node写入读取文件内容• 详解angular中操作DOM元素的方法• react 怎么实现按需加载• 聊聊Node中怎么用async函数
    1/1

    PHP中文网