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里粘贴文字后,移动光标至最后的更多相关文章

  1. “display:block-inline形式的Span或Div中添加文字后,导致Span或Div排版掉落、错位”的原因及解决方法

    最近在使用3个span(或div)制作带圆角边框的按钮时,按照常识,把span的display设置成inline-block,这样就可以设置span的width和height了,很爽的~ 可是当我在中 ...

  2. 让透明div里的文字不透明

    最近在工作中遇到一个问题,我在div里写上文字,当我把div变为半透明的时候,里面的文字也会随之透明.情况如下: <div class="box"> 这是一段不应该透明 ...

  3. 【小瑕疵】在div里插入img后在底部留有缝隙怎么解决

    [本文转载自http://blog.sina.com.cn/s/blog_9fd5b6df01013mld.html] 图片IMG与容器下边界之间有空隙怎么办?这里介绍3中简单的解决方法. 第一,给图 ...

  4. source insight 里编辑的时候,每次粘贴后,光标停留在粘贴内容的左面

    在source insight 里编辑的时候,每次粘贴后,光标停留在粘贴内容的左面.我想把它设定为 粘贴后,光标移动倒粘贴内容的右面. 该怎么做? 这是个设置问题,按照下面的步骤设定就可以了. Opt ...

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

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

  6. 实现图标Icon+文字在div里自动中心居中(水平垂直居中)

    已知div行高设置text-align:center文字会自动居中. 通过:before来设置icon的地址和高宽. 需要设置图片默认的垂直居中条件,与文字一致,为text-bottom. 设置图片行 ...

  7. 微信小程序-输入框输入文字后,将光标移到文字中间,接着输入文字后光标又自动跳到最后

    问题描述: input输入框输入一段文字后,将光标移到文字中间,接着输入文字后光标又自动跳到最后去了. 原因: input事件中,给input框绑定任何事件后,在处理事件时 setData之后就会让光 ...

  8. Xshell用鼠标选中一段文字后自动换行的问题

    JavaScript   HTML(CSS) ASP 跨浏览器开发 IIS Apache vbScript JavaScript 应用服务器 XML/XSL 其他 CGI Ajax 非技术区 Cold ...

  9. div中让文字垂直居中

    在div中如何让文字垂直居中? 作者在刚接触web前端开发时就遇到了这个问题,一直没有记录下来,今天正好有空,便记录下来. 为了方便展示,我把style先直接写在了div里. 效果如下图所示: 图1. ...

随机推荐

  1. 学习TensorFlow的tf.concat使用

    https://www.tensorflow.org/api_docs/python/tf/concat

  2. 命令行编译C++程序

        使用命令行来编译C++程序,我们可以有两种方法:     方法一:     1. 依次打开开始程序->Visual Studio 2010 –>Visual Studio tool ...

  3. JavaScript 使用穷举方式实现内容简繁转换

    场景: 在Web开发中,有时存在对内容进行简体和繁体互相转换的需求,这时我们可以参考以下做法. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 ...

  4. 网络上可供测试的Web Service

    网络上可供测试的Web Service 腾讯QQ在线状态 WEB 服务Endpoint: http://www.webxml.com.cn/webservices/qqOnlineWebService ...

  5. maven添加本地jar到本地库中

    maven添加本地jar到本地库中(用于远端地址下载不了的情况) 在dos命令行执行以下命令将会吧ojdbc14-10.2.0.4.0.jar添加到本地库中(ps:必须已经安装了,maven,并配置了 ...

  6. Android四大组件之——ContentProvider(一)

    Android四大组件之--ContentProvider(一) 本人邮箱:JohnTsai.Work@gmail.com,欢迎交流讨论. 欢迎转载,转载请注明网址:http://www.cnblog ...

  7. IOS私有API的使用(转)

    最近在做企业级程序,需要搞设备的udid等信息,但是ios7把udid私有化了,不公开使用.所以研究了一下ios的私有api.   调查了一下文章,发现这方面的文章不多,国内更是不全,高手们都懒得写基 ...

  8. PHP缓存机制详解

    一,PHP缓存机制详解 我们可以使用PHP自带的缓存机制来完成页面静态化,但是仅靠PHP自身的缓存机制并不能完美的解决页面静态化,往往需要和其他静态化技术(通常是伪静态技术)结合使用. output ...

  9. UML类图关系(转,添加了实例)

    UML类图关系(泛化 .继承.实现.依赖.关联.聚合.组合) 在UML类图中,常见的有以下几种关系: 泛化(Generalization),  实现(Realization),关联(Associati ...

  10. Eclipse------用Tomcat运行项目后出现:严重: Error configuring application listener of class org.springframework.web.context.ContextLoaderListener

    Eclipse中Tomcat运行项目后出现: 严重: Error configuring application listener of class org.springframework.web.c ...