<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<SCRIPT LANGUAGE="JavaScript">
<!--
var tmpDragObj;
function dragStart(){
tmpDragObj = event.srcElement;
tdiv = document.createElement("div");
tdiv.innerHTML = tmpDragObj.outerHTML;
tdiv.style.display = "block";
tdiv.style.position = "absolute";
tdiv.style.filter = "alpha(opacity=100)";
tdiv.style.cursor = "move";
tdiv.style.width = tmpDragObj.offsetWidth;
tdiv.style.height = tmpDragObj.offsetHeight;
tdiv.style.top = getInfo(tmpDragObj).top;
tdiv.style.left = getInfo(tmpDragObj).left;
document.body.appendChild(tdiv);
lastX = event.clientX;
lastY = event.clientY;
lastLeft = tdiv.style.left;
lastTop = tdiv.style.top;
try
{
tmpDragObj.dragDrop();
}catch(e)
{
}
}
function draging()
{
var tX = event.clientX;
var tY = event.clientY;
tdiv.style.left = parseInt(lastLeft) + tX-lastX;
tdiv.style.top = parseInt(lastTop) + tY-lastY;
}
function getInfo(o)//取得坐标
{
var to=new Object();
to.left=to.right=to.top=to.bottom=0;
var twidth=o.offsetWidth;
var theight=o.offsetHeight;
while(o!=document.body)
{
to.left+=o.offsetLeft;
to.top+=o.offsetTop;
o=o.offsetParent;
}
to.right=to.left+twidth;
to.bottom=to.top+theight;
return to;
}
function dragEnd()
{
if (true)
{
var tX=event.clientX;
var tY=event.clientY;
var parentCell=getInfo(ejej);
if(tX>=parentCell.left&&tX<=parentCell.right&&tY>=parentCell.top&&tY<=parentCell.bottom)
{
if (tmpDragObj.innerHTML == "") return;
var tempoption = document.createElement("option");
tempoption.value=tmpDragObj.innerHTML;
tempoption.text=tmpDragObj.innerHTML;
ejej.options.add(tempoption);
tmpDragObj.style.backgroundColor = "red";
tdiv.innerHTML = "33333";
document.body.removeChild(tdiv);
return;
}
}
mm = ff(150,15);
}
function ff(aa,ab)//从GOOGLE网站来,用于恢复位置
{
var ac=parseInt(getInfo(tdiv).left);
var ad=parseInt(getInfo(tdiv).top);
var ae=(ac-getInfo(tmpDragObj).left)/ab;
var af=(ad-getInfo(tmpDragObj).top)/ab;
return setInterval(function()
{
if(ab<1)
{
clearInterval(mm);
tdiv.removeNode(true);
tmpDragObj=null;
return
}
ab--;
ac-=ae;
ad-=af;
tdiv.style.left=parseInt(ac)+"px";
tdiv.style.top=parseInt(ad)+"px"
}, aa/ab)
}
function createTable(){
var table_1 = document.createElement("table");
var table_2 = document.createElement("tbody");
for(i=0;i<3;i++){
var row_temp = document.createElement("tr");
for(j=0;j<5;j++){
var td_temp = document.createElement("td");
td_temp.setAttribute("width","100");
td_temp.onmousedown = dragStart;
td_temp.ondrag = draging;
td_temp.ondragend = dragEnd;
td_temp.appendChild(document.createTextNode(i*5+j));
row_temp.appendChild(td_temp);
}
table_2.appendChild(row_temp);
}
table_1.setAttribute("border","1");
table_1.appendChild(table_2);
document.body.appendChild(table_1);
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<TABLE border="1" width="300">
<TR>
<TD onmousedown="dragStart();" ondrag="draging();" ondragend="dragEnd();" >sdfasdfas</TD>
</TR>
<TR>
<TD onmousedown="dragStart();" ondrag="draging();" ondragend="dragEnd();" >34535345</TD>
</TR>
</TABLE>
<input type="text" name="cmbLevel1"/>
<SELECT NAME="ejej" style="width:220px;">
</SELECT>
<div id="xx"></div>
<SCRIPT LANGUAGE="JavaScript">
<!--
createTable();
//-->
</SCRIPT>
</BODY>
</HTML>
分享到：
相关推荐
"WPS 表格中设置数字显示范围及技巧" ...可以在拖放选定的一个或多个单元格至新位置的同时，按住 Shift 键可以快速修改单元格内容的次序。 6、快速切换工作簿 可以按下 Ctrl+Tab 键快速切换工作簿。 ...
3. 数据源的配置：可以通过数据绑定将数据库中的数据填充到下拉列表。这可以通过使用SqlDataSource控件连接到SQL Server数据库，然后设置SelectCommand来执行查询获取数据。 4. 将SqlDataSource与DropDownList关联，...
以下演示具有嵌套下拉列表和自定义拖动图像。 它是一种 WYSIWYG 设计仪表板的工具。 新的小部件可以从左侧的调色板拖到仪表板中，小部件可以通过拖放来移动。安装通过或安装 # Use npmnpm install vue-easy
6. **自定义控件**：如果需要在单元格内添加特定的控件，如复选框或下拉列表，可以使用QGraphicsProxyWidget。这个类可以将任何QWidget转换为QGraphicsItem，使其能在QGraphicsScene中使用。 综上所述，利用...
`InPlaceList`可能是一个下拉列表，允许用户从预设选项中选择，而`InPlaceEdit`则是一个在选中单元格时出现的文本编辑框，允许用户直接输入数据。这两个组件提高了用户交互性和数据输入的灵活性。 `TitleTip.cpp`很...
9.27 动态拖放表格的宽度 9.28 可输入内容的表格 9.29 可以分级的表格隐藏 9.30 动态创建表格并实现分页 9.31 删除表格指定行 9.32 设置表格的交替行颜色 9.33 双击单元格变为可编辑 9.34 鼠标经过表格时列变色 9.35...
9.27 动态拖放表格的宽度 9.28 可输入内容的表格 9.29 可以分级的表格隐藏 9.30 动态创建表格并实现分页 9.31 删除表格指定行 9.32 设置表格的交替行颜色 9.33 双击单元格变为可编辑 9.34 鼠标经过表格时列变色 9.35...
而`sortable`则提供了一种交互式的拖放排序功能，用户可以直接通过鼠标拖动表头来改变列的顺序。 在实际应用中，可能还需要考虑响应式设计，确保在不同设备和屏幕尺寸下，表头固定的效果都能良好展现。这可能需要...
在"jQuery EasyUI拖动商品添加购物车实例代码"中，我们可以看到一个实用的电商功能实现，即允许用户通过鼠标拖放操作将商品添加到虚拟购物车，同时实时计算购物车中的商品总额。 1. **jQuery EasyUI基础知识**： -...
这个组件利用了Windows Forms中的DataGridView控件，以提供数据的显示、编辑和操作能力，同时也引入了Excel的一些特色功能，如下拉列表和拖放填充，以增强用户体验。 1. DataGridView控件：这是.NET Framework中的...
26. 列类型：SmartGrid定义了普通列、文本框列、复选框列、下拉列表框列四种列类型，程序员也可以定义自己的列类型。 27. 排序：用户可以通过点击列头对某列进行排序。SmartGrid提供了两种排序方式：客户端排序和...
类库允许开发者自定义单元格的外观和行为，可以添加按钮、下拉列表等控件，甚至实现复杂的编辑器。此外，Ultimate Grid的事件驱动模型让开发者能够轻松扩展其功能。 5. **示例和文档**： 压缩包中包含的示例代码...
在Excel 2021中，工作表的移动与复制是一项基本操作，它允许用户根据需要重新排列工作簿中的内容，或者将数据分享到其他工作簿。以下是对这个主题的详细说明： 首先，理解工作表的基本概念：在Excel中，工作簿是由...
多列下拉框控件，通常称为ComboBox，是一种允许用户在输入框中选择一个项或通过下拉列表进行多级筛选的交互元素。在某些情况下，单列下拉框可能无法充分展示复杂的数据结构，因此多列下拉框成为了一个很好的解决方案...
8. **1.10.8 Drag and Drop Rows in DataGrid（可拖放行的数据表格）**：允许用户拖放表格中的行。 9. **1.10.9 Drag and Drop Rows in TreeGrid（可拖放行的树形表格）**：允许用户拖放树形表格中的行。 10. **...
12. **联动（Linkage）**：例如，当选择一个下拉列表的选项时，另一个下拉列表会根据选择自动更新其内容。 通过学习这些示例，你可以掌握如何配置和使用EasyUI的各种组件，理解它们的工作原理，以及如何根据项目...
1. **动态下拉列表框**：在网页中，下拉列表框是常见的用户交互元素。通过JavaScript，我们可以实现动态加载选项，响应用户输入或者根据其他条件改变列表内容。例如，使用AJAX异步请求数据，实现实时搜索建议功能。 ...
41. **用下拉列表快速输入数据**：使用数据验证创建列表。 42. **快速输入自定义短语**：创建自定义列表。 43. **设置单元格背景色**：使用“填充色”。 44. **快速在多个单元格中输入相同公式**：选中区域，输入...
7.2.5 下拉列表框 7.2.6 日期输入控件Ext.form.DateField 7.2.7 在线编辑器Ext.form.HtmlEditor 7.3 ExtJS表单组件的综合应用 第8章 设计表格类布局 8.1 表格简介 8.1.1 表格的基本属性 8.1.2 制作第一个表格...
7.2.5 下拉列表框 7.2.6 日期输入控件Ext.form.DateField 7.2.7 在线编辑器Ext.form.HtmlEditor 7.3 ExtJS表单组件的综合应用 第8章 设计表格类布局 8.1 表格简介 8.1.1 表格的基本属性 8.1.2 制作第一个表格...