如何让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');
<span style="font-size:18px">divTitle.draggable().click(function ()
{
$(this).draggable({ disabled: false });
$(this).css('backgroundColor', 'transparent');
}).dblclick(function ()
{
$(this).draggable({ disabled: true });
$(this).css('backgroundColor', '#FFFF6F');
});</span
这样控制一下就可以让div同时具有edit和drag属性了。
如何让DIV可编辑、可拖动的更多相关文章
- div可编辑 可拖动
版权声明:本文为博主原创文章,未经博主允许不得转载. 1.可编辑: <div id="move" contentEditable="true">可编 ...
- IOS第七天(6:UiTableView编辑模式, 拖动位置 ,滑动删除)
**********UiTableView编辑模式, 拖动位置 ,滑动删除 #import "HMViewController.h" @interface HMViewContro ...
- 使DIV相对窗口大小左右拖动始终水平居中
<!doctype html> <html> <head> <meta http-equiv="content-type" content ...
- div 可编辑--获取光标位置插入元素
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Language" ...
- div的edit和drag(点击div可编辑、删除、拖动)
1.可编辑: <div id="move" contentEditable="true">可编辑</div> 设置contentEdit ...
- 设置DIV可编辑
<div id="move" contentEditable="true">可编辑</div> 设置contentEditable属性可 ...
- contenteditable="true"让div可编辑
今天才知道有这个属性,真是out了. 不过以前一直没做编辑器有关的,毕竟开源的很多. 现在觉得开源的也不是这么好用,自己写写简单的吧 用了 <div class="content-bo ...
- div可编辑框,去除粘贴文字样式😄
上个月做了个聊天的需求(网页版的).说到聊天都想到输入框,说到输入框都会想到input,但是input标签是不支持插入图片的(包括areatext标签).查阅了一些资料就看到div标签有一个属性con ...
- DIV可编辑后,与限制输入及光标偏移的纠葛
前言 最近在弄个人的网站,偶然间发现DIV可以设置编辑模式,之前设计的方案在此功能上需要限制输入的长度.网上搜索了一波,综合搜索的结果,考虑使用的监听事件有:keydown .textInput .i ...
随机推荐
- 【Mac系统】istatmenus6.20下载以及激活
下载地址:https://pan.baidu.com/s/1-2-yw2NnOlGJ46D536t5uQ iStat Menus 的激活密码: Email: 982092332@qq.com SN: ...
- iOS 线程管理的学习记录
本文转载至 http://www.2cto.com/kf/201312/265451.html 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 2 ...
- java排序(整理)
冒泡排序(面试都要问的算法) 一.基本思想:每次比较相邻的两个 元素,按需调整顺序 二.题目:要求将 12 35 99 18 76 这 5 个数进行从大到小排序 三.思路: (1)先比较第 1 ...
- 记录-阿里云Oss文件上传
public class OssUtil { /** * 上传图片 * @param file * @param request * @return */ public static Map<S ...
- eclipse里面用svn关联项目
eclipse里面共享项目经常会用到svn或者git插件 关联项目的步骤如下: 如果 点击finish会遇到卡住问题的话,不要着急,我们需要设置svn的client设置: 如果设置了之后还是很卡的话, ...
- WINDOWS的用户和用户组说明
1.基本用户组 Administrators 属于该administators本地组内的用户,都具备系统管理员的权限,它们拥有对这台计算机最大的控制权限,可以执行整台计算机的管理任务.内置的系统管理员 ...
- 一些blog地址总结整理:
女神 python之路-网络编程初版:https://www.cnblogs.com/Eva-J/articles/8066842.html python之路-网络编程(重点看这个,更细致):http ...
- Python高级入门01-property
JAVA中存在对变量 私有化,公开,保护... 私有化时候,需要提供一个公开的get 和 set方法对外公开,让别人进行调用 python中同样存在 私有化变量定义是__是这个双下划线,eg:_ ...
- 【python】-- pymsql 外键
pymsql 外键 本片是以上一篇pymsql操作MySQL的补充,主要演示pymysql的外键操作使用 一.一对一外键关联 1.示意图 2.一对一外键关联示例 2.1.创建表结构,插入数据 from ...
- Android异步载入全解析之使用AsyncTask
Android异步载入全解析之使用AsyncTask 概述 既然前面提到了多线程,就不得不提到线程池,通过线程池,不仅能够对并发线程进行管理.更能够提高他们运行的效率.优化整个App.当然我们能够自己 ...