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.对 ...
随机推荐
- 【CF1250G】Discarding Game(DP)
题意:A和B玩游戏,一共n轮,A先B后,第i轮两人分别能得到a[i]和b[i]的得分,累加到当前得分和中 每一轮进行完之后A可以选择抵消得分,即两者都减去两者的min 若某个时刻某个人得分和不小于K则 ...
- rollup的学习
概述(Overview) Rollup 是一个 JavaScript 模块打包器,可以将小块代码编译成大块复杂的代码,例如 library 或应用程序.Rollup 对代码模块使用新的标准化格式,这些 ...
- 本地运行aws lambda credential 配置 (missing credential config error)
参照这篇文章 http://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/loading-node-credentials-sha ...
- angular 语法的应用
angular.js 一个js框架 , 是三大主流框架之一:( vue react angular ): 原先的开发:前端和后台,利用 Ajax 进行交互, 但是框架却提出了一种开发模式:mvc 这 ...
- SQL语句多个字段排序
写在前面的话: 本次迭代,分配的任务有点多啊,好在本妈妈朝10晚6的加班加点.其中一项就是列表展示啊, 展示就展示呗,还要排序.排序也可以,测试时排序字段值为啥都一样啊.结果点一下一个顺序. 就想在第 ...
- Dubbo负载均衡:最少活跃数(LeastActive)
官方文档定义 最少活跃调用数,相同活跃数的随机,活跃数指调用前后计数差. 使慢的提供者收到更少请求,因为越慢的提供者的调用前后计数差会越大. 关于活跃数 最少活跃数负载均衡,最关键的点在于活跃数.活跃 ...
- DB2创建视图并授权给其他用户
创建视图并授权给其他用户 可以在操作系统界面.或者DB2交互界面下进行数据库操作 查看数据库节点[db2inst1@ELONEHR-DB ~]$ db2 list db directory Syste ...
- 连接Access数据库
web.config添加配置 <connectionStrings> <add name="connStr" connectionString="Pro ...
- 八:flask-重定向示例
现象:访问地址a,跳转到地址b,在flask中,使用redirect()来进行重定向 永久性重定向:301,多用于旧网址被废弃了,需要跳转到新网址访问 例如请求www.jingdong.com,会自动 ...
- 思维导图之kubernetes
k8s docker