div里粘贴文字后,移动光标至最后
cursormanager.js
//Namespace management idea from http://enterprisejquery.com/2010/10/how-good-c-habits-can-encourage-bad-javascript-habits-part-1/
(function( cursorManager ) { //From: http://www.w3.org/TR/html-markup/syntax.html#syntax-elements
var voidNodeTags = ['AREA', 'BASE', 'BR', 'COL', 'EMBED', 'HR', 'IMG', 'INPUT', 'KEYGEN', 'LINK', 'MENUITEM', 'META', 'PARAM', 'SOURCE', 'TRACK', 'WBR', 'BASEFONT', 'BGSOUND', 'FRAME', 'ISINDEX']; //From: http://stackoverflow.com/questions/237104/array-containsobj-in-javascript
Array.prototype.contains = function(obj) {
var i = this.length;
while (i--) {
if (this[i] === obj) {
return true;
}
}
return false;
} //Basic idea from: http://stackoverflow.com/questions/19790442/test-if-an-element-can-contain-text
function canContainText(node) {
if(node.nodeType == 1) { //is an element node
return !voidNodeTags.contains(node.nodeName);
} else { //is not an element node
return false;
}
}; function getLastChildElement(el){
var lc = el.lastChild;
while(lc && lc.nodeType != 1) {
if(lc.previousSibling)
lc = lc.previousSibling;
else
break;
}
return lc;
} //Based on Nico Burns's answer
cursorManager.setEndOfContenteditable = function(contentEditableElement)
{ while(getLastChildElement(contentEditableElement) &&
canContainText(getLastChildElement(contentEditableElement))) {
contentEditableElement = getLastChildElement(contentEditableElement);
} var range,selection;
if(document.createRange)//Firefox, Chrome, Opera, Safari, IE 9+
{
range = document.createRange();//Create a range (a range is a like the selection but invisible)
range.selectNodeContents(contentEditableElement);//Select the entire contents of the element with the range
range.collapse(false);//collapse the range to the end point. false means collapse to end rather than the start
selection = window.getSelection();//get the selection object (allows you to change selection)
selection.removeAllRanges();//remove any selections already made
selection.addRange(range);//make the range you have just created the visible selection
}
else if(document.selection)//IE 8 and lower
{
range = document.body.createTextRange();//Create a range (a range is a like the selection but invisible)
range.moveToElementText(contentEditableElement);//Select the entire contents of the element with the range
range.collapse(false);//collapse the range to the end point. false means collapse to end rather than the start
range.select();//Select the range (make it the visible selection
}
} }( window.cursorManager = window.cursorManager || {}));
<div contenteditable="true" class="text" id="content" v-on:keyup="triggerKeyup" v-on:paste="triggerPaste">
triggerPaste:function(e) {
if (plus.os.name == "iOS") {
var clipboardData, pastedData; // Stop data actually being pasted into div
e.stopPropagation();
e.preventDefault(); // Get pasted data via clipboard API
clipboardData = e.clipboardData || window.clipboardData;
pastedData = clipboardData.getData('Text');
//rDataHTML = clipboardData.getData('text/html');
//rDataPText = clipboardData.getData('text/plain'); document.getElementById('content').innerHTML = document.getElementById('content').innerHTML + pastedData; cursorManager.setEndOfContenteditable(document.getElementById('content'));
}
},
div里粘贴文字后,移动光标至最后的更多相关文章
- “display:block-inline形式的Span或Div中添加文字后,导致Span或Div排版掉落、错位”的原因及解决方法
最近在使用3个span(或div)制作带圆角边框的按钮时,按照常识,把span的display设置成inline-block,这样就可以设置span的width和height了,很爽的~ 可是当我在中 ...
- 让透明div里的文字不透明
最近在工作中遇到一个问题,我在div里写上文字,当我把div变为半透明的时候,里面的文字也会随之透明.情况如下: <div class="box"> 这是一段不应该透明 ...
- 【小瑕疵】在div里插入img后在底部留有缝隙怎么解决
[本文转载自http://blog.sina.com.cn/s/blog_9fd5b6df01013mld.html] 图片IMG与容器下边界之间有空隙怎么办?这里介绍3中简单的解决方法. 第一,给图 ...
- source insight 里编辑的时候,每次粘贴后,光标停留在粘贴内容的左面
在source insight 里编辑的时候,每次粘贴后,光标停留在粘贴内容的左面.我想把它设定为 粘贴后,光标移动倒粘贴内容的右面. 该怎么做? 这是个设置问题,按照下面的步骤设定就可以了. Opt ...
- div可编辑框,去除粘贴文字样式😄
上个月做了个聊天的需求(网页版的).说到聊天都想到输入框,说到输入框都会想到input,但是input标签是不支持插入图片的(包括areatext标签).查阅了一些资料就看到div标签有一个属性con ...
- 实现图标Icon+文字在div里自动中心居中(水平垂直居中)
已知div行高设置text-align:center文字会自动居中. 通过:before来设置icon的地址和高宽. 需要设置图片默认的垂直居中条件,与文字一致,为text-bottom. 设置图片行 ...
- 微信小程序-输入框输入文字后,将光标移到文字中间,接着输入文字后光标又自动跳到最后
问题描述: input输入框输入一段文字后,将光标移到文字中间,接着输入文字后光标又自动跳到最后去了. 原因: input事件中,给input框绑定任何事件后,在处理事件时 setData之后就会让光 ...
- Xshell用鼠标选中一段文字后自动换行的问题
JavaScript HTML(CSS) ASP 跨浏览器开发 IIS Apache vbScript JavaScript 应用服务器 XML/XSL 其他 CGI Ajax 非技术区 Cold ...
- div中让文字垂直居中
在div中如何让文字垂直居中? 作者在刚接触web前端开发时就遇到了这个问题,一直没有记录下来,今天正好有空,便记录下来. 为了方便展示,我把style先直接写在了div里. 效果如下图所示: 图1. ...
随机推荐
- R绘图系统边框详解
在R语言的基础绘图系统中,有plot, figure, outer, inner 共4种边框: 这四种边框实际上明确了整个绘图设备的布局 1) outer, 当我们声明一个绘图设备的时候,outer ...
- 精选10款超酷的HTML5/CSS3菜单
今天向大家精选了10款超酷的HTML5/CSS3菜单,给你的网页添加不一样的精彩,一起来围观一下吧. 1.CSS3手风琴菜单 下拉展开带弹性动画 利用CSS3技术可以实现各种各样的网页菜单,我们之前也 ...
- 关于最近WIN7系统错误711的解决办法
昨天晚上有发现部分用户反馈错误711,因为不在现场不清楚是怎么一回事,今天早上又有其他客户反馈他下面有4个用户发生711错误. 刚好在电脑边上,就拨号试下,结果我的也是711 这个711的症状是: 单 ...
- tp5的学习
1.安装,官网下载 2.访问配置:http://localhost/App/public/ 3.入口文件,项目目录/public // 定义应用目录 define('APP_PATH', __DIR_ ...
- CodeFirst时使用T4模板
我们都知道T4模板用于生成相似代码. 在DBFirst和ModelFirst条件下我们很容易从.edmx下获取所有实体类和其名称,并且通过我们定义的模板和某些遍历工作为我们生成所需要的相似代码. 但是 ...
- Java 从静态代理到动态代理
先举个静态代理的例子,可能多少有些不恰当,不过本次学习记录,重点不在于通信协议. 比如你在一个机房里,你不能联网,只能连通过一台能连公网的代理机器上网.你发送了一个http请求,将由代理帮你上网. 首 ...
- js如何获取asp.net服务器端控件的值(label,textbox,dropdownlist,radiobuttonlist等)
js如何获取asp.net服务器端控件的值(label,textbox,dropdownlist,radiobuttonlist等) 欢迎访问原稿:http://hi.baidu.com/2wixia ...
- HTML5 touche vents drag to move & AF actionsheet by longTap
$('img').on("touchstart",function(E){ //E.preventDefault();E.stopPropagation(); var el=thi ...
- __setup、early_param的解析
内核初始化时根据字符串匹配获得相应的处理函数,查找的时候有些麻烦. 写个脚本对将内核中的__setup和early_param显式做了解析: __setup #! /bin/bash grep '\& ...
- 【Dynamic Programming】DP算法
http://www.hawstein.com/posts/dp-novice-to-advanced.html