div的edit和drag(点击div可编辑、删除、拖动)
1、可编辑:
<div id="move" contentEditable="true">可编辑</div>
设置contentEditable属性可以让div编程可编辑状态
2、可拖动:
$('#move').draggable();
使用jQuery UI的draggable可以让div变成可拖动状态,但是如果两个属性同时应用就会出现可编辑功能失效的状况。
3、可编辑、可拖动:
<div id="move" contentEditable="true">可编辑</div>
var divTitle=$('#move');
divTitle.draggable().click(function ()
{
$(this).draggable({ disabled: false });
$(this).css('backgroundColor', 'transparent');
}).dblclick(function ()
{
$(this).draggable({ disabled: true });
$(this).css('backgroundColor', '#FFFF6F');
});
这样控制一下就可以让div同时具有edit和drag属性了。
div的edit和drag(点击div可编辑、删除、拖动)的更多相关文章
- checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中
checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...
- HTML-点击Div读取本地文件内容
<!DOCTYPE html> <html> <div id="container" onclick="choosefile();" ...
- 点击div 跳转并通过URL传参
点击div前要先给div绑定要传的参数: //给panel绑定自定义属性,方便在跳转时传带参数,键/值对排列 panel.attr("user_age",user_age); pa ...
- 如何禁用事件的浮升(div的子元素的点击事件会触发父元素的点击事件)
<div onclick="alert();"> <div onclick="alert();"></div> </d ...
- 点击div区域以外部分,div区域隐藏
核心思想: 监听body的click事件,事件触发的时候判断是否发生在弹出的div上,如果不在,关闭弹层 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM ...
- 点击按钮显示隐藏DIV,点击DIV外面隐藏DIV
点击按钮显示隐藏DIV,点击DIV外面隐藏DIV 注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="tex ...
- div加链接 html给div加超链接实现点击div跳转的方法[申明:来源于网络]
div加链接 html给div加超链接实现点击div跳转的方法[申明:来源于网络] 地址:http://www.cdxwcx.com/faq/htmldivLink.html
- 21.JQ的监听事件(点击div外面可以让它消失)
JQ的监听事件(点击div外面可以让它消失) //监听整个页面 $(document).bind("click", function() { //给需要的对象赋予事件 $(&quo ...
- js实现的点击div区域外隐藏div区域
首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡:1.对 ...
随机推荐
- zabbix配置通过远程命令来发送邮件
1.安装好zabbix后,在/var/log/zabbix可以查看日志. 2.主机通过zabbix-get检查 yum install zabbix-get -y zabbix-get -s 客户主 ...
- wait, notify 使用清晰讲解
一个庙里, 三个和尚,只有一个碗, 三个和尚都要吃饭,所以每次吃饭的时候, 三个和尚抢着碗吃. package interview.java.difference.l05; public class ...
- async await task.Result 卡死
在如下代码中: public async Task<string> GetData() { return await DoWork(); } 在UI线程中调用 var data = Get ...
- a = a + b 与 a += b 的区别
1.对于同样类型的a,b来说 两个式子执行的结果确实没有什么区别.但是从编译的角度看吧(武让说的),a+=b;执行的时候效率高. 2.对于不同类型的a,b来说 2.1 不同类型的两个变量在进行运 ...
- 文件的权利和sudoers中规定的权限哪个更大?
文件的权利和sudoers中规定的权限哪个更大? 当然是文件的权限更大!!! 这也是linux的 更安全的根本所在! 就是它的每一个文件都有严格的 rwxr--r-- 权限规定. 只有文件权限规定了的 ...
- Django学习之Form表单
一.Form介绍 普通方式手写注册功能 使用form组件实现注册功能 二.Form那些事儿 1.常用字段与插件 initial error_messages password radioSelect ...
- Windows操作路由表
route print route add 172.17.0.0 mask 255.255.0.0 192.168.99.100 route delete 172.17.0.0 mask 255.25 ...
- Delphi Tokyo 10.2.3发布了
Delphi Tokyo 10.2.3发布了 http://blog.sina.com.cn/s/blog_44fa172f0102wwwg.html (2018-03-14 07:51:32) 转载 ...
- 应用安全 - 平台 | 工具 - Nexus漏洞汇总
CVE-2019-5475 Date: 类型: RCE 影响范围: Nexus Repository Manager OSS <= Nexus Repository Manager Pro &l ...
- 【Linux开发】计算机底层是如何访问显卡的?
1. 显卡驱动是怎么控制显卡的, 就是说, 使用那些指令控制显卡, 通过端口么? 2. DirectX 或 OpenGL 或 CUDA 或 OpenCL 怎么找到显卡驱动, 显卡驱动是不是要为他们提供 ...