javascript实现拖拽并替换网页块元素_编程学院

新闻中心 News 分类>>

联系我们 Contact us

服务热线：020 88798357

地址：广州市增城区中新镇慈岭村埔咀路20号
邮箱：sales@gzdairan.cn

您所在的位置是：首页 > 新闻中心 > 网络学院 > 编程学院

javascript实现拖拽并替换网页块元素

2026-01-16 11:16:22

浏览次数：次

返回列表

找了一些现成的插件，发现都不太符合我的需求，于是参考网上的例子自己实现了一个，还没有优化。

还是贴代码吧：
dragtoreplace
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>DragToReplaceDeom</title> <style> #displayRoom{background:#eee;position:relative;float:left;clear:both;padding:30px 0px 0px 20px;margin-left:20px;margin-top:10px;} .row{display:inline-block;float:left;width:90px;clear:none;top:0;/**//*background:#DFEFFC;*/} .row span{display:inline-block;width:60px;clear:none;background:#9192B1;height:30px;line-height:30px;margin-bottom:30px;text-align:center;} span.usr{cursor:pointer;position:absolute;display:inline-block;width:60px;clear:none;height:30px;line-height:30px;margin-bottom:30px;text-align:center;background:#4DA74D;color:#fff;} span.usr.catch{background:#BD9B33!important;} </style> </head> <body> 学生甲 学生乙 学生一 </body> </html>
[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

上一篇：javascript 设置文本框中焦点的位置

下一篇：ExtJS Grid使用SimpleStore、多选框的方法

网站首页

关于我们

产品展示

新闻中心

户外常识

在线留言

联系我们

新闻中心 News 分类>>

javascript实现拖拽并替换网页块元素