首頁 >web前端 >js教程 >javascript實作表格排序編輯拖曳縮放_javascript技巧

javascript實作表格排序編輯拖曳縮放_javascript技巧

WBOY原創: 2016-05-16 16:22:451012瀏覽

簡單表格排序

可以雙擊編輯自訂編輯後的規則

可拖曳列進行列替換

可推動邊框進行列寬度的縮放

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
http://www.w3.org/1999/xhtml">

Table










































































表>

（函數（窗口，未定義）{
window.Sys = 函數 (ua){
    var b = {
        即： /msie/.test(ua) && !/opera/.test(ua),
        歌劇：/opera/.test(ua),
        Safari: /webkit/.test(ua) && !/chrome/.test(ua),
        火狐：/firefox/.test(ua),
        鉻：/chrome/.test(ua)
    },vMark = "";
    for (var i in b) {
        if (b[i]) { vMark = "safari" == i ? 「版本」：我；休息; }
    }
    b.version = vMark && RegExp("(?:" vMark ")[\/: ]([\d.] )").test(ua) ? RegExp.$1 : "0";
    b.ie6 = b.ie && parseInt(b.version, 10) == 6;
    b.ie7 = b.ie && parseInt(b.version, 10) == 7;
    b.ie8 = b.ie && parseInt(b.version, 10) == 8;
    回 b;
}(window.navigator.userAgent.toLowerCase());

window.Sys.ie6&&document.execCommand("BackgroundImageCache", false, true);

視窗.$ = 函數(Id){
    return document.getElementById(Id);
};
window.addListener = function(element,e,fn){
    !element.events&&(element.events = {});
    element.events[e]&&(element.events[e][addListener.guid ]=fn)||(element.events[e] = {'0':fn});
    element.addEventListener?element.addEventListener(e,fn,false):element.attachEvent("on" e,fn);
};
window.addListener.guid = 1;
window.removeListener = function(element,e,fn){
    var handlers = element.events[e],type;
    如果（fn）{
        for（輸入處理程序）
            if(handlers[type]===fn){
                element.removeEventListener?element.removeEventListener(e,fn,false):element.detachEvent("on" e,fn);
                移除處理程序[型別];
            }
    }其他{
        for（輸入處理程序）{
            element.removeEventListener?element.removeEventListener(e,handlers[type],false):element.detachEvent("on" e,handlers[type]);
            移除處理程序[型別];
        }
    }
};
window.setStyle = function(e,o){
    if(typeof o=="string")
        e.style.cssText=o;
    否則
        for(var i in o)
            e.style[i] = o[i];
};

var slice = Array.prototype.slice;
window.Bind = function(object, fun) {
    var args = slice.call(arguments).slice(2);
    回傳函數() {
            return fun.apply(object, args);
    };
};
window.BindAsEventListener = function(object, fun,args) {
    var args = slice.call(arguments).slice(2);
    返回函數（事件）{
        return fun.apply(object, [event || window.event].concat(args));
    }
};
//從jQ
複製 window.Extend = function(){
var 目標 = 參數[0] || {}, i = 1, length = argument.length, deep = true, options;
if ( typeof target === "boolean" ) {
  深度=目標；
  目標=參數[1] || {};
  我 = 2;
}
if ( typeof target !== "object" && Object.prototype.toString.call(target)!="[object Function]")
  目標 = {};
for(;i   if ( (options = argument[ i ]) != null )
   for(選項中的變數名稱){
    var src = target[ name ], copy = options[ name ];
    if ( 目標 === 複製 )
     繼續；
    if ( deep && copy && typeof copy === "object" && !copy.nodeType ){
     target[ name ] = argument.callee( deep, src || ( copy.length != null ? [ ] : { } ), copy );
    }
    else if(複製！==未定義)
     目標[名稱]=複製；
   }
}
返回目標；
};
window.objPos = function(o){
var x = 0, y = 0;
do{x = o.offsetLeft;y = o.offsetTop;}while((o=o.offsetParent));
return {'x':x,'y':y};
}
window.Class = 函數(屬性){
var _class = function(){return (arguments[0] !== null && this.initialize && typeof(this.initialize) == 'function') ? this.initialize.apply(this, 參數) : this;};
    _class.prototype = 屬性;
    回傳_class;
};
window.hasClass = 函數（元素，類別名稱）{
return element.className.match(new RegExp('(\s|^)' className '(\s|$)'));
} ;
window.addClass = function(element, className) {
!this.hasClass(element, className)&&(element.className = " " className);
}
window.removeClass = function(element, className) {
hasClass(element, className)&&(element.className = element.className.replace(new RegExp('(\s|^)' className '(\s|$)'),' ')) ;
}
})(視窗);

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：JavaScript中的Truthy與Falsy介紹_javascript技巧下一篇：JavaScript中的Truthy與Falsy介紹_javascript技巧

看更多

ID	选中	姓名	生日	备注頭>
1		小三	1982-05-27	杯具，全是杯具
3		李四	1983-06-27	恩恩我魔獸技術不錯
2		王五	1987-05-27	波斯王子時之刃還好
4		趙六	1988-05-27	我叫趙六
5		朱八	1984-05-27	洗睡吧
6		阿斯多夫	1984-06-27	阿斯多夫暗房逢燈
7		杯具	1984-06-27	很多杯具
8		餐具	1984-02-27	許多器具
8		盥洗用品	1984-08-27	許多盥洗用品
9		內牛滿面	1984-12-27	10快一晚
10		犀利哥	1984-12-21	嘿嘿

javascript實作表格排序 編輯 拖曳 縮放_javascript技巧

相關文章

javascript實作表格排序編輯拖曳縮放_javascript技巧