============================================================================
前台页面代码 [提示：只需把信息替换成你要绑定的数据即可，代码里网络图片是测试加载用]
============================================================================
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>拖动模块</title>
<style>
.dragTable
{
background-color:#DBE5CF;
position:relative;
}
.dragTableHeader
{
cursor:move;
}
body,td,th {
font-size: 12px;
}
a:link {
text-decoration: underline;
}
a:visited {
text-decoration: underline;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: underline;
}
</style>
<script type="text/javascript">
window.onload=function(){
var a = document.getElementById("loading");
a.parentNode.removeChild(a);
}
document.write('<div id="loading" style="background:#CC4444;color:#FFF;width:80px;padding-left:5px;position:absolute;line-height:22px;font-size:12px">正在读取...</div>');
</script>
<script language="javascript" type="text/javascript" src="go.js"></script>
<script defer>
document.onmousemove=MouseMoveToMove;
document.onmouseup=MouseUpToMove;
</script>
</head>
<body>
<br />
<form id="Form1" runat="server">
<div align="center">
<input type="button" id="save" value="保存修改" style="visibility: hidden; width: 80%;
height: 30px; border-color: #AFD781; background-color: #ffffff; border-style: double;
border-width: 1px" onclick="saveFun()"></div>
<br />
<table width="80%" border="0" cellpadding="5" cellspacing="1" bgcolor="#AFD781" align="center">
<tr>
<td valign="top" style="width: 25%; background-color: #ffffff; height: 135px;">
<input type="hidden" name="tableName" value="空间-------1">
<table border="0" cellpadding="5" cellspacing="1" width="100%" class="dragTable"
onmouseover="MouseOverFun(this);">
<tr>
<input type="hidden" name="tableName" value="体育新闻">
<td bgcolor="#AFD781" class="dragTableHeader" onmousedown='MouseDownToMove(this)'>
体育新闻</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">
<u><font color="red">体育新闻信息 </font></u>
</td>
</tr>
</table>
<table border="0" cellpadding="5" cellspacing="1" width="100%" class="dragTable"
onmouseover="MouseOverFun(this);">
<tr>
<input type="hidden" name="tableName" value="焦点信息">
<td bgcolor="#AFD781" class="dragTableHeader" onmousedown='MouseDownToMove(this)'>
焦点信息</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">
<u><font color="red">焦点新闻信息 </font></u>
</td>
</tr>
</table>
<table width="100%" onmouseover="MouseOverFun(this);" style="position: relative;
background-color: White">
<tr>
<td>
</td>
</tr>
</table>
</td>
<td width="50%" valign="top" style="height: 135px; background-color: #ffffff">
<input type="hidden" name="tableName" value="空间-------2">
<table border="0" cellpadding="5" cellspacing="1" width="100%" class="dragTable"
onmouseover="MouseOverFun(this);">
<tr>
<input type="hidden" name="tableName" value="娱乐新闻">
<td bgcolor="#AFD781" class="dragTableHeader" onmousedown='MouseDownToMove(this)'>
娱乐新闻</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">
<u><font color="red">娱乐新闻信息 </font></u>
</td>
</tr>
</table>
<table border="0" cellpadding="5" cellspacing="1" width="100%" class="dragTable"
onmouseover="MouseOverFun(this);">
<tr>
<input type="hidden" name="tableName" value="国际新闻">
<td bgcolor="#AFD781" class="dragTableHeader" onmousedown='MouseDownToMove(this)'>
国际新闻</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">
<u><font color="red">国际新闻信息 </font></u>
</td>
</tr>
</table>
<table width="100%" onmouseover="MouseOverFun(this);" style="position: relative;
background-color: White">
<tr>
<td>
</td>
</tr>
</table>
</td>
<td valign="top" style="width: 25%; background-color: #ffffff; height: 135px;">
<input type="hidden" name="tableName" value="空间-------3">
<table border="0" cellpadding="5" cellspacing="1" width="100%" class="dragTable"
onmouseover="MouseOverFun(this);">
<tr>
<input type="hidden" name="tableName" value="实事新闻">
<td bgcolor="#AFD781" class="dragTableHeader" onmousedown='MouseDownToMove(this)'>
实事新闻</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">
<u><font color="red">实事新闻信息</font></u>
</td>
</tr>
</table>
<table border="0" cellpadding="5" cellspacing="1" width="100%" class="dragTable"
onmouseover="MouseOverFun(this);">
<tr>
<input type="hidden" name="tableName" value="农民新闻">
<td bgcolor="#AFD781" class="dragTableHeader" onmousedown='MouseDownToMove(this)'>
农民新闻</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">
<u><font color="red">农民新闻信息 </font></u>
</td>
</tr>
</table>
<table width="100%" onmouseover="MouseOverFun(this);" style="position: relative;
background-color: White">
<tr>
<td>
</td>
</tr>
</table>
</td>
</tr>
</table>
<br />
<br />
<div align="center">
<img src="http://www.wallcoo.com/human/hongkong_wallpaper_1024/mxxx01/%5Bwallcoo_com%5D_hongkong_wallpaper_0164.jpg"
style="border: 3px solid #AFD781;" width="80%" /></div>
<br />
</form>
</body>
</html>
<script>
function saveFun()
{
var tableNameObjs=document.getElementsByName("tableName");
var tempStr="";
for(var i=0;i<tableNameObjs.length;i++)
{
tempStr +="\n"+tableNameObjs[i].value;
}
alert(tempStr);
}
</script>
============================================================================
脚本go.js代码 [提示：复制保存成go.js文件，与页面放置一个文件夹下即可]
============================================================================
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。