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可编辑、可拖动的更多相关文章

  1. div可编辑 可拖动

    版权声明:本文为博主原创文章,未经博主允许不得转载. 1.可编辑: <div id="move" contentEditable="true">可编 ...

  2. IOS第七天(6:UiTableView编辑模式, 拖动位置 ,滑动删除)

    **********UiTableView编辑模式, 拖动位置 ,滑动删除 #import "HMViewController.h" @interface HMViewContro ...

  3. 使DIV相对窗口大小左右拖动始终水平居中

    <!doctype html> <html> <head> <meta http-equiv="content-type" content ...

  4. div 可编辑--获取光标位置插入元素

    <!DOCTYPE html> <html> <head>     <meta http-equiv="Content-Language" ...

  5. div的edit和drag(点击div可编辑、删除、拖动)

    1.可编辑: <div id="move" contentEditable="true">可编辑</div> 设置contentEdit ...

  6. 设置DIV可编辑

    <div id="move" contentEditable="true">可编辑</div> 设置contentEditable属性可 ...

  7. contenteditable="true"让div可编辑

    今天才知道有这个属性,真是out了. 不过以前一直没做编辑器有关的,毕竟开源的很多. 现在觉得开源的也不是这么好用,自己写写简单的吧 用了 <div class="content-bo ...

  8. div可编辑框,去除粘贴文字样式😄

    上个月做了个聊天的需求(网页版的).说到聊天都想到输入框,说到输入框都会想到input,但是input标签是不支持插入图片的(包括areatext标签).查阅了一些资料就看到div标签有一个属性con ...

  9. DIV可编辑后,与限制输入及光标偏移的纠葛

    前言 最近在弄个人的网站,偶然间发现DIV可以设置编辑模式,之前设计的方案在此功能上需要限制输入的长度.网上搜索了一波,综合搜索的结果,考虑使用的监听事件有:keydown .textInput .i ...

随机推荐

  1. java高级之信号灯Semaphore

    1.Semaphore概念 Semaphore是Java1.5之后提供的一种同步工具,Semaphore可以维护访问自身线程个数,并提供了同步机制.使用Semaphore可以控制同时访问资源的线程个数 ...

  2. GT背靠背onsite

    Google: 因为暑假在G家实习过,所以仅仅是简单面了2轮. 后来跟曾经的intern host吃饭得知,他和还有一个reviewer对我的实习工作都给了不错的评价,所以面试的时候面试官都放水了.题 ...

  3. ubuntu 16.04.3 安装完成后的一些初始化工作

    虚拟机安装前记得把桥接调好! 1. 重置root密码 sudo passwd, 然后系统会让你输入密码,这时输入的密码就是root用户的密码,su root切用户 2. 设置固定IP,有重启服务功能令 ...

  4. json格式转数组注意事项

    今天遇到一个特别奇葩的问题,json格式明明是正确的,转数组时却就是出不来,后来才发现是文件的编码问题,文件的编码一定要是utf-8无BOM格式,这点一定要切记!切记! 如果想确认json是否正确:h ...

  5. 股神小L 2016Vijos省选集训 day1

    股神小L (stock.c/pas/cpp)============================ 小L厌倦了算法竞赛,希望到股市里一展身手.他凭借自己还行的计算机功底和可以的智商,成功建立一个模型 ...

  6. wcf利用IDispatchMessageInspector实现接口监控日志记录和并发限流

    一般对于提供出来的接口,虽然知道在哪些业务场景下才会被调用,但是不知道什么时候被调用.调用的频率.接口性能,当出现问题的时候也不容易重现请求:为了追踪这些内容就需要把每次接口的调用信息给完整的记录下来 ...

  7. ASP获取上月本月下月的第一天和最后一天

    上月第一天:<%=dateadd("m",-1,year(date)&"-"&month(date)&"-1" ...

  8. Js版json解析

    JsonDecoder={ pos:0, isDigit:function(ch){ return ( ch >= '0' && ch <= '9' )||( ch == ...

  9. 我的Android进阶之旅------>Android基于HTTP协议的多线程断点下载器的实现

    一.首先写这篇文章之前,要了解实现该Android多线程断点下载器的几个知识点 1.多线程下载的原理,如下图所示 注意:由于Android移动设备和PC机的处理器还是不能相比,所以开辟的子线程建议不要 ...

  10. memcpy使用

    void memcpy(void dest, const void *src, size_t n); 功能编辑 从源src所指的内存地址的起始位置开始拷贝n个字节到目标dest所指的内存地址的起始位置 ...