精华内容
下载资源
问答
  • oDragTable.js 拖动表格单元格改变列宽或行高,兼容全浏览器,一句代码调用,原创代码,下载文件中包含JS源代码和示例代码。
  • 拖动交换单元格内容

    千次阅读 2008-02-14 10:31:00
    HTML>HEAD>META http-equiv="Content-Type" content=... charset=gb2312">TITLE>拖动TITLE>STYLE>...td{...}{width:20%;height:20px;border-bottom:1px solid black;border-right:1px solid black;cursor:de
    <HTML>
    <HEAD>
    <META http-equiv="Content-Type" content="text/html; charset=gb2312">
    <TITLE>拖动</TITLE>
    <STYLE>
    td
    {width:20%;height:20px;border-bottom:1px solid black;border-right:1px solid black;cursor:default;}
    div
    {font-size:13px;}
    th
    {height:20px;font-size:12px;font-weight:normal;border-bottom:2px solid black;background-color:#CCCCCC}
    table
    {border:1px solid black;font-size:13px;}
    </STYLE>
    <script language="javascript">
    /************************************ dragedTableData.js *******************************/
    /************************************ dragedTableData.js *******************************/
    /*
    * created by LxcJie 2004.4.12
    * 可以实现表格内容的内部拖动
    * 确保中间过度层的存在,id为指定
    */


    /*--------全局变量-----------*/
    var dragedTable_x0,dragedTable_y0,dragedTable_x1,dragedTable_y1;
    var dragedTable_movable = false;
    var dragedTable_preCell = null;
    var dragedTable_normalColor = null;
    //起始单元格的颜色
    var dragedTable_preColor = "lavender";
    //目标单元格的颜色
    var dragedTable_endColor = "#FFCCFF";
    var dragedTable_movedDiv = "dragedTable_movedDiv";
    var dragedTable_tableId = "";
    /*--------全局变量-----------*/

    function DragedTable(tableId)
    {
    dragedTable_tableId 
    = tableId;
    var oTempDiv = document.createElement("div");
    oTempDiv.id 
    = dragedTable_movedDiv;
    oTempDiv.onselectstart 
    = function(){return false};
    oTempDiv.style.cursor 
    = "hand";
    oTempDiv.style.position 
    = "absolute";
    oTempDiv.style.border 
    = "1px solid black";
    oTempDiv.style.backgroundColor 
    = dragedTable_endColor;
    oTempDiv.style.display 
    = "none";
    document.body.appendChild(oTempDiv);
    document.all(tableId).onmousedown 
    = showDiv;
    }


    //得到控件的绝对位置
    function getPos(cell)
    {
    var pos = new Array();
    var t=cell.offsetTop;
    var l=cell.offsetLeft;
    while(cell=cell.offsetParent)
    {
    t
    +=cell.offsetTop;
    l
    +=cell.offsetLeft;
    }

    pos[
    0= t;
    pos[
    1= l;
    return pos;
    }


    //显示图层
    function showDiv()
    {
    var obj = event.srcElement;
    var pos = new Array();
    //获取过度图层
    var oDiv = document.all(dragedTable_movedDiv);
    if(obj.tagName.toLowerCase() == "td")
    {
    obj.style.cursor 
    = "hand";
    pos 
    = getPos(obj);
    //计算中间过度层位置,赋值
    oDiv.style.width = obj.offsetWidth;
    oDiv.style.height 
    = obj.offsetHeight;
    oDiv.style.top 
    = pos[0];
    oDiv.style.left 
    = pos[1];
    oDiv.innerHTML 
    = obj.innerHTML;
    oDiv.style.display 
    = "";
    dragedTable_x0 
    = pos[1];
    dragedTable_y0 
    = pos[0];
    dragedTable_x1 
    = event.clientX;
    dragedTable_y1 
    = event.clientY;
    //记住原td
    dragedTable_normalColor = obj.style.backgroundColor;
    obj.style.backgroundColor 
    = dragedTable_preColor;
    dragedTable_preCell 
    = obj;

    dragedTable_movable 
    = true;
    }

    }

    function dragDiv()
    {
    if(dragedTable_movable)
    {
    var oDiv = document.all(dragedTable_movedDiv);
    var pos = new Array();
    oDiv.style.top 
    = event.clientY - dragedTable_y1 + dragedTable_y0;
    oDiv.style.left 
    = event.clientX - dragedTable_x1 + dragedTable_x0;
    var oTable = document.all(dragedTable_tableId);
    for(var i=0; i<oTable.cells.length; i++)
    {
    if(oTable.cells[i].tagName.toLowerCase() == "td")
    {
    pos 
    = getPos(oTable.cells[i]);
    if(event.x>pos[1]&&event.x<pos[1]+oTable.cells[i].offsetWidth
    && event.y>pos[0]&& event.y<pos[0]+oTable.cells[i].offsetHeight)
    {
    if(oTable.cells[i] != dragedTable_preCell)
    oTable.cells[i].style.backgroundColor 
    = dragedTable_endColor;
    }

    else
    {
    if(oTable.cells[i] != dragedTable_preCell)
    oTable.cells[i].style.backgroundColor 
    = dragedTable_normalColor;
    }

    }

    }

    }

    }


    function hideDiv()
    {
    if(dragedTable_movable)
    {
    var oTable = document.all(dragedTable_tableId);
    var pos = new Array();
    if(dragedTable_preCell != null)
    {
    for(var i=0; i<oTable.cells.length; i++)
    {
    pos 
    = getPos(oTable.cells[i]);
    //计算鼠标位置,是否在某个单元格的范围之内
    if(event.x>pos[1]&&event.x<pos[1]+oTable.cells[i].offsetWidth
    && event.y>pos[0]&& event.y<pos[0]+oTable.cells[i].offsetHeight)
    {
    if(oTable.cells[i].tagName.toLowerCase() == "td")
    {
    //交换文本
    dragedTable_preCell.innerHTML = oTable.cells[i].innerHTML;
    oTable.cells[i].innerHTML 
    = document.all(dragedTable_movedDiv).innerHTML;
    //清除原单元格和目标单元格的样式
    dragedTable_preCell.style.backgroundColor = dragedTable_normalColor;
    oTable.cells[i].style.backgroundColor 
    = dragedTable_normalColor;
    oTable.cells[i].style.cursor 
    = "";
    dragedTable_preCell.style.cursor 
    = "";
    dragedTable_preCell.style.backgroundColor 
    = dragedTable_normalColor;
    }

    }

    }

    }

    dragedTable_movable 
    = false;
    //清除提示图层
    document.all(dragedTable_movedDiv).style.display = "none";
    }

    }


    document.onmouseup 
    = function()
    {
    hideDiv();
    var oTable = document.all(dragedTable_tableId);
    for(var i=0; i<oTable.cells.length; i++)
    oTable.cells[i].style.backgroundColor 
    = dragedTable_normalColor;
    }


    document.onmousemove 
    = function()
    {
    dragDiv();
    }


    /************************************ dragedTableData.js 结束 *******************************/
    /************************************ dragedTableData.js 结束 *******************************/
    </script>
    <script language="javascript">
    function init()
    {
    //注册可拖拽表格
    new DragedTable("tableId");
    }

    </script>
    </HEAD>
    <BODY oncontextmenu="return false;" onload="init()">
    <TABLE id="tableId" width="70%" align="center" cellpadding="0" cellspacing="0">
    <TR>
    <TH colspan="4" style="">拖动交换单元格内容</TH>
    </TR>
    <TR>
    <TD>Java</TD>
    <TD>Java One </TD>
    <TD>JBuilder</TD>
    <TD>Stuts</TD>
    </TR>
    <TR>
    <TD>C++</TD>
    <TD>Visual Studio</TD>
    <TD>Office</TD>
    <TD>Windows</TD>
    </TR>
    <TR>
    <TD>PhotoShop</TD>
    <TD>Java</TD>
    <TD>Illustrator</TD>
    <TD>PageMaker</TD>
    </TR>
    <TR>
    <TD>Cartoon</TD>
    <TD>Telephone</TD>
    <TD>China</TD>
    <TD>USA</TD>
    </TR>
    <TR>
    <TD>Java</TD>
    <TD>Java One </TD>
    <TD>JBuilder</TD>
    <TD>Stuts</TD>
    </TR>
    <TR>
    <TD>C++</TD>
    <TD>Visual Studio</TD>
    <TD>Office</TD>
    <TD>Windows</TD>
    </TR>
    <TR>
    <TD>PhotoShop</TD>
    <TD>Flash</TD>
    <TD>Illustrator</TD>
    <TD>PageMaker</TD>
    </TR>
    <TR>
    <TD>Cartoon</TD>
    <TD>Telephone</TD>
    <TD>China</TD>
    <TD>USA</TD>
    </TR>
    </TABLE>
    </BODY>
    </HTML> 
     
    展开全文
  • #pragma mark-- 单元格删除、添加方法,只要实现了此方法就能支持删除了,但添加还需要其它 (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle ...

    #pragma mark-- 单元格删除、添加方法,只要实现了此方法就能支持删除了,但添加还需要其它

    • (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath

    {

    if (editingStyle == UITableViewCellEditingStyleDelete) {
    
        //MVC => 数据是保存在模型中
    
        //删除步骤1. 删除 self.forumListArray 中 indexPath 对应的数据
    
        [self.forumListArray removeObjectAtIndex:indexPath.row];
    
        //删除步骤2. 刷新表格 即重新加载所有数据
    
        [self.subTableView reloadData];
    
        //步骤2还可以写成:
    
        //deleteRowsAtIndexPaths 是让表格控件动画删除指定的行
    

    // [self.subTableView deleteRowsAtIndexPaths:@[indexPath] withRowAnimation:(UITableViewRowAnimationMiddle)];

    }else if (editingStyle == UITableViewCellEditingStyleInsert){
    
        //1.向数组添加数据
    
        [self.forumListArray insertObject:@"闫超志" atIndex:indexPath.row];
    
        //2.刷新表格
    

    // [self.subTableView reloadData];

        //步骤2还可以写成
    
        //新建一个indexpath
    
        NSIndexPath *path = [NSIndexPath indexPathForRow:indexPath.row inSection:indexPath.section];
    
        [self.subTableView insertRowsAtIndexPaths:@[path] withRowAnimation:(UITableViewRowAnimationMiddle)];
    
    }
    

    }

    #pragma mark-- tableview代理方法,添加cell的方法.注意:上面要添加协议,另外要先在viewdidload里面将tableview设置成可编辑状态

    • (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath

    {

    if (indexPath.row % 2) {
    
    return UITableViewCellEditingStyleDelete;
    
    }
    
    return UITableViewCellEditingStyleInsert;
    

    }

    #pragma mark-- 单元格拖动方法

    • (void)tableView:(UITableView *)tableView moveRowAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath *)destinationIndexPath
      {
      [self.forumListArray exchangeObjectAtIndex:sourceIndexPath.row withObjectAtIndex:destinationIndexPath.row];
      }
    展开全文
  • 做了一个可拖动单元格的List,算是对List的一个扩展。看效果先:  单元格是可以拖动的,并且可以在三个List之间拖动,不过没加自动滚动来着。AS相当简单,三个List组件分别是list1、list2、list3,然后把所有代码...
    做了一个可拖动单元格的List,算是对List的一个扩展。看效果先:
     单元格是可以拖动的,并且可以在三个List之间拖动,不过没加自动滚动来着。AS相当简单,三个List组件分别是list1、list2、list3,然后把所有代码copy到第一帧就可以了。
    import fl.events.ListEvent;
    import fl.controls.List;
    import fl.controls.listClasses.ICellRenderer;
    import fl.controls.listClasses.ListData;
    //为组件添加数据
    var i:uint = 0;
    for(i = 0;i
     
    本文转自:http://www.5uflash.com/flashjiaocheng/Flashaschengxu/4412.html
    展开全文
  • 无标题页 body{margin:0px;padding:0px;} td{cursor:move;width:100px;text-align:center;} #spantd{background-color:
     
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>无标题页</title>
        <style type="text/css">
            body{margin:0px;padding:0px;}
            td{cursor:move;width:100px;text-align:center;}
            #spantd{background-color:Red;border:1px solid red;position:absolute;text-align:center;cursor:move;color:White;z-index:3;filter:alpha(opacity=50);opacity:0.5}
        </style>
        <script type="text/javascript">
            function Drag(gvID){            
                this.gvID=typeof gvID=="string"?document.getElementById(gvID):gvID;
                this.gvLeft=this.gvID.offsetLeft;
                this.gvTop = this.gvID.offsetTop;
                this.gvHeight=this.gvID.offsetHeight;
            }
            Drag.prototype={
                init:function(){
                      var td = this.gvID.getElementsByTagName("td");
                      var len = td.length;
                      for(var i=0;i<len;i++){
                           this.addEvent(td[i],"mousedown",this.bindEvent(this,this.Down,td[i]));
                      }
                },
                Down:function(){
                    var e = arguments[0];
                    var thistd = arguments[1];   
                    this.oLeft = thistd.offsetLeft+this.gvLeft;
                    this.oTop = thistd.offsetTop+this.gvTop;
                    var createspan=document.createElement("span");
                    createspan.id="spantd";
                    createspan.innerHTML=thistd.innerHTML;
                    createspan.style.top=this.oTop+"px";
                    createspan.style.left=this.oLeft+"px"
                    createspan.style.height=thistd.offsetHeight-2+"px";
                    createspan.style.width=thistd.offsetWidth-2+"px";
                    document.body.appendChild(createspan);
                    this.newtop = e.clientY-this.oTop;
                    this.oMove = this.bindEvent(this,this.Move,createspan);
                    this.oUp = this.bindEvent(this,this.Up,[createspan,thistd]);
                    this.addEvent(document,"mousemove",this.oMove);
                    this.addEvent(document,"mouseup",this.oUp);
                },
                Move:function(){
                    var e = arguments[0];
                    var thisspan = arguments[1];
                    window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
                    var top = e.clientY-this.newtop;
                    if(top<=this.gvTop+thisspan.offsetHeight)
                        top=this.gvTop+thisspan.offsetHeight;
                    if(top+thisspan.offsetHeight>=this.gvHeight)
                        top=this.gvHeight-thisspan.offsetHeight;
                    thisspan.style.top=top+"px";
                },
                Up:function(){
                    var e = arguments[0];
                    var thisspan=arguments[1][0];
                    var thistd = arguments[1][1];
                    var index = Math.round((parseInt(thisspan.style.top)-parseInt(this.oTop))/parseInt(thisspan.offsetHeight));
                    var parent = thistd.parentNode.getElementsByTagName("td");
                    var indexTwo=0;
                    for(var i=0;i<parent.length;i++){
                        if(parent[i]==thistd){
                            indexTwo=i;
                            break;
                        }
                    }
                    if(thisspan)
                        document.body.removeChild(thisspan); 
                    var star=0;
                    var child = thistd.parentNode;
                    while(child!=null){
                        if(star==index)
                            break;
                        if(index>0){
                            ++star;
                            child=child.nextSibling;
                        }
                        else{
                            --star;
                            child=child.previousSibling;
                        }
                    }
                    child.getElementsByTagName("td")[indexTwo].innerHTML=thistd.innerHTML;                
                    this.deleteEvent(document,"mousemove",this.oMove);
                    this.deleteEvent(document,"mouseup",this.oUp);
                },
                bindEvent:function(obj,fun,para){
                      return function(e){
                         fun.apply(obj,[e||window.event,para]);
                      }
                },
                addEvent:function(OTarget,Name,FunName){
                    if(OTarget.addEventListener){
                        OTarget.addEventListener(Name,FunName,false);
                    }
                    else if(OTarget.attachEvent){
                        OTarget.attachEvent("on"+Name,FunName);
                    }
                    else{
                        OTarget["on"+Name]=FunName;
                    }
                },
                deleteEvent:function(oTarget,name,funName){
                    if(oTarget.removeEventListener) {  
                        oTarget.removeEventListener(name,funName,false);  
                    } 
                    else if(oTarget.detachEvent) {  
                        oTarget.detachEvent("on" + name,funName);  
                    }
                    else{  
                        oTarget["on" + name] = null;  
                    } 
                }
            }
            window.onload = function(){
                var d = new Drag("GridView2");
                d.init();
                
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" >
        <Columns>
            <asp:BoundField HeaderText="ID" DataField="ID" />
            <asp:BoundField HeaderText="Name" DataField="Name" />
        </Columns>
        </asp:GridView>    
        </form>
    </body>
    </html>

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                GridView2.DataSource = getTable();
                GridView2.DataBind();
            }
        }
        public DataTable getTable()
        {
            string[] name = { "张三", "李四", "王五","赵六","林七" };
            DataTable dt = new DataTable("XML");
            dt.Columns.Add("ID", typeof(System.Int32));
            dt.Columns.Add("Name", typeof(System.String));
            dt.Columns.Add("Time", typeof(System.DateTime));
            for (int i = 0; i < name.Length; i++)
            {
                DataRow row = dt.NewRow();
                row[0] = i + 1;
                row[1] = name[i];
                row[2] = Convert.ToDateTime("2011-6-2");
                dt.Rows.Add(row);
            }
            return dt;
        }

    展开全文
  • 拖动单元格改变列宽或行高,可以扩展成表格设计器,改变tr 行高 td 列宽
  • 返回目录 以下知识源码位置: [Git: ... ... ...本节概要:单元格区域鼠标左键拖动单元格,选择点亮区域内的单元格,效果如下: 0.基础知识: ...
  • jQuery实现的拖动调整表格td单元格的大小:在实际应用中,可能有这样的需求,那就是需要调整td单元格的大小。也许是为了便于观察,也许是其他原因,反正这样的需求是有的,下面就分享一段能够实现此功能的代码。代码...
  • 设置单元格不能拖动复制: 在 Body中加上这些: 设置内容不能复制: 在相应的 input 框加上这些 οncοpy=“return false” οnpaste=“return false” oncut=“return false” οncοntextmenu=“return false;” ...
  • 本控件为一个DataGridView用户控件,可以实现在DataGridView进行单元格的任意拖动操作。 本程序开发环境: c# vs2008 测试环境:Windows 2003 windows xp
  • 本文主要是实现了一个拖动选择单元格并计算的功能 CalcSelecitonModel.js下载地址 转载于:https://www.cnblogs.com/Carpe-Diem/p/4307955.html
  • 实例需求:对于A列的非规则合并单元,在B列中合并其内容。 虽然在无数经典图书和文章中都告诫大家,合并单元格是数据分析的绊...A列数据粘贴到记事本,然后再分段拷贝到B列单元格,在工作表中向下拖动滚动条发现10...
  • 主要介绍了jQuery实现拖动调整表格单元格大小的代码实例,本文直接给出实现代码,需要的朋友可以参考下
  • 鼠标拖动改变左右单元格宽度
  • excel合并单元格内容

    2013-10-18 13:29:00
    ”来合并单元格内容  如果我们想将多列的内容合并到一列中,不需要利用函数,一个小小的连字符“&”就能将它搞定。例如想把A、B、C列合并到D列中,操作方法如下: 1、只需要在D1单元格中输入公式:=A1&B1...
  • 效果如下图所示:碰到合并单元格,会自动做大选取范围。 代码: <!DOCTYPE html> <html> <HEAD> <TITLE>0003按住鼠标拖选单元格</TITLE> <script src="/static/jquery/...
  • excel 合并单元格内容

    2010-12-07 18:28:00
    方法一:用连字符“&”来合并单元格内容 如果我们想将多列的内容合并到一列中,不需要利用函数,一个小小的连字符“&”就能将它搞定。例如想把A、B、C列合并到D列中,操作方法如下:1、只需要在D1单元格中输入公式...
  • 通过重载jtable中的gettooltiptext()方法来完成鼠标... jtable可以自由拖动列分割符,或者有些单元格内容过长,不完全显示内容,带省略号,如何检测到这个??? 我只需要针对内容未完成显示的单元格进行提示!
  • 一个表格里面有些单元格可放,有些单元格不可放,有内容单元格拖动到可放置的单元格的时候,鼠标松开,把两个单元格内容互换
  • 拖拽表格单元格,改变单元格内容

    千次阅读 2015-11-12 21:32:40
    拖动 td{width:20%;height:20px;border-bottom:1px solid black;border-right:1px solid black;cursor:default;} div{font-size:13px;} th{height:20px;font-size:12px;font-weight:normal;border-bottom:2px sol
  • 简单,下载下来即可使用,可根据自己需求更改!!!!!!!!!!!!!
  • javascript实现表格的单元格拖动排序,对实现图片的拖动排序有启发
  • 然后在[对齐方式]命令组中,点击居中对齐按钮,将单元格内容在垂直方向上,进行居中显示。 3. 点击底部对齐按钮,将单元格内容在垂直方向上,进行底部对齐显示。 4. 点击文字居中按钮,将单元格...
  • 技巧一:用连字符“&”来合并单元格内容  如果我们想将多列的内容合并到一列中,不需要利用函数,一个小小的连字符“&”就能将它搞定。例如想把A、B、C列合并到D列中,操作方法如下: 1、只需要在D1单元格中输入...
  • js拖拽单元格内容

    千次阅读 2014-02-17 21:34:05
    JS动态拖动表格实现 td{width:20%;height:20px;border-bottom:1px solid black;border-right:1px solid black;cursor:default;} div{font-size:13px;} th{height:20px;font-size:12px;font-weight:normal;border-...
  • 在任意单元格,按下鼠标后,可以选中多个行和多个列,松开鼠标后,这些单元格的背景色变化(就像是Excel拖动单元格选择似的那种) 将拖动选中的单元格进行合并 现在可以选中合并了,但我要的是点击右键菜单 ...
  • 连接符号:& 如下图,我们要将表格中每名员工的姓名、入职时间...我们在任意单元格中输入=,然后选择我们要连接的单元格,之间用&进行连接。回车后出现如下图“刘备200129”,并没有达成我们想要格...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 15,102
精华内容 6,040
关键字:

怎么拖动单元格内容