Machen Sie die Titelspalte der Tabelle durch das JQuery-Plug-In package_jquery nach links und rechts dehnbar

Der Plug-in-Name lautet: jquery.tableresize.js und der Code lautet wie folgt:

Code kopieren Der Code lautet wie folgt:

/*
Geschrieben von mlcactus, 24.11.2014
Dies ist ein von mir gepacktes JQuery-Plugin, das es ermöglicht, jede Spalte der Tabelle nach links und rechts zu strecken und dadurch die Breite zu verkleinern oder zu vergrößern
Verwendung:
Einzelne Tabelle: $("#table_id").tableresize(); Alle Tabellen auf der Seite: $("table").tableresize();
*/
(Funktion ($) {
$.fn.tableresize = function () {
        var _document = $("body");
          $(this).each(function () {
If (!$.tableresize) {
                        $.tableresize = {};
            }
              var _table = $(this);
                      //ID festlegen
               var id = _table.attr("id") || "tableresize_" (Math.random() * 100000).toFixed(0).toString();
            var tr = _table.find("tr").first(), ths = tr.children(), _firstth = ths.first();
                           //Temporäres Variablenspeicherobjekt festlegen
            var cobjs = $.tableresize[id] = {};
cobjs._currentObj = null, cobjs._currentLeft = null;
               ths.mousemove(function (e) {
                var _this = $(this);
var left = _this.offset().left, top = _this.offset().top, width = _this.width(), height = _this.height(), right = linke Breite, unten = obere Höhe, clientX = e .clientX, clientY = e.clientY;
              var leftside = !_firstth.is(_this) && Math.abs(left - clientX) <= 5, rightside = Math.abs(right - clientX) <= 5;
If (cobjs._currentLeft || clientY > top && clientY < bottom && (leftside || rightside)) {
                    _document.css("cursor", "e-resize");
If (!cobjs._currentLeft) {
                          if (leftside) {
cobjs._currentObj = _this.prev();
                                                     }                          sonst {
cobjs._currentObj = _this;
                                                   }                    }
                }
                    sonst {
cobjs._currentObj = null;
                }
            });
               ths.mouseout(function (e) {
                if (!cobjs._currentLeft) {
                    cobjs._currentObj = null;
                    _document.css("cursor", "auto");
                }
            });
            _document.mousedown(function (e) {
                if (cobjs._currentObj) {
                    cobjs._currentLeft = e.clientX;
                }
                sonst {
                    cobjs._currentLeft = null;
                }
            });
            _document.mouseup(function (e) {
                if (cobjs._currentLeft) {
                    cobjs._currentObj.width(cobjs._currentObj.width() (e.clientX - cobjs._currentLeft));
                }
                cobjs._currentObj = null;
                cobjs._currentLeft = null;
                _document.css("cursor", "auto");
            });
        });
    };
})(jQuery);  

页面代码为：

复制代码 代码如下:

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

    
    
    
    
    


    表格1

    
        
            
        
            
            
            
    
    

ID	名字	年纪	地址	电话
22	Name:44	Alter:23	Adresse:47	Telefon:15< /td>
28	Name:42	Alter:68	Adresse:30	Telefon:50< /td>
29	Name:63	Alter:48	Adresse:90	Telefon:76< /td>

    
表格2

    
        
            
        
            
            
    

ID	名字	年纪	地址	电话
22	Name:44	Alter:23	Adresse:47	Telefon:15< /td>
28	Name:42	Alter:68	Adresse:30	Telefon:50< /td>