DIV当textarea使用,在聚焦的时候将光标移动到内容的末尾
#### DIV当textarea使用,在聚焦的时候将光标移动到内容的末尾 #### <style type="text/css">
.test_box {
width: 400px;
min-height: 120px;
max-height: 300px;
_height: 120px;
margin-left: auto;
margin-right: auto;
padding: 3px;
outline: 0;
border: 1px solid #a0b3d6;
font-size: 12px;
word-wrap: break-word;
overflow-x: hidden;
overflow-y: auto;
}
</style>
HTML代码:
<div class="test_box" contenteditable="true" id="comment"><br /><a href="http://www.baidu.com">aaaa</a></div> <script> document.getElementById("comment").onfocus=function(){
var tObj = document.getElementById("comment"); var len = tObj.innerHTML.length;
place_caret_at_end(tObj); } function place_caret_at_end(el)
{
el.focus();
if (typeof window.getSelection != "undefined" && typeof document.createRange != "undefined")
{
var range = document.createRange();
range.selectNodeContents(el);
range.collapse(false);
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
} else if (typeof document.body.createTextRange != "undefined") {
var textRange = document.body.createTextRange();
textRange.moveToElementText(el);
textRange.collapse(false);
textRange.select();
}
} </script>
DIV当textarea使用,在聚焦的时候将光标移动到内容的末尾的更多相关文章
- div模拟textarea实现高度自增长
今天突然有位前端的朋友问我textarea怎么实现高度随内容自增长,我一下子懵了,首先想到的是用js改变textarea的高度,但是百度了很多参考代码效果都不是很理想. 因为之前实际项目中用的text ...
- div模拟textarea以实现高度自适应实例页面
作为多行文本域功能来讲,textarea满足了我们大部分的需求.然而,textarea有一个不足就是不能像普通div标签一样高度可以跟随内容自适应.textarea总是很自信地显摆它的滚动条,高度固执 ...
- div模拟textarea文本域轻松实现高度自适应
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- textarea自适应高度,div模仿textarea可编辑实现自适应高度,placeholder使用图标
1.textarea自适应高度,placeholder使用图标 自适应高度,有很多种办法: 1)jq: $("textarea").on("input",fun ...
- 用一个div模拟textarea的实现
<textarea> 标签定义一个多行的文本输入控件.但是它不能像div一样随着内容增加而自动增加,一言不合就出现滚动条,有是有为了更好的交互,可能需要使用div来模拟textarea的实 ...
- H5新增属性contenteditable(不用JS,实现div模拟textarea高度自增长)
无意中看到一篇博客介绍了contenteditable这个属性——不需用JS,只需在div里加上contenteditable="true",即可实现div模拟textrarea( ...
- div模拟textarea文本域轻松实现高度自适应——张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1362 一.关于tex ...
- 用一个div模拟textarea并实现高度自适应
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="U ...
- div模拟textarea自适应高度
之前在公司做项目的时候,有这么一个需求,要我写一个评论框,可以随着评论的行数增加而自动扩大,最开始我想用textarea实现,但是后来尝试后发现textarea并不适合,textarea的高度不会随着 ...
随机推荐
- day02 Java基础
1.Java中的关键字都是小写的. 2.Java中的关键字 3.Java中的注释分为:单行注释.多行注释.文档注释 文档注释将被javadoc工具解析生成一个说明书. 4.Java中的常量分为字面值常 ...
- 如何用eclispe远程调试tomcat--转载
原文地址:http://jingyan.baidu.com/article/0320e2c1f4ef6b1b87507b06.html tomcat是一种非常常见的java web应用服务器,有时候服 ...
- Android(java)学习笔记108:通过反射获取私有构造方法并且使用
反射获取私有构造方法并且使用: 1.获取字节码文件.class对象: Class c = Class.forName("cn.itcast_01.Person") ...
- mybatis缓存创建过程
带着 上篇 的问题,再来看看mybatis的创建过程 1.从SqlSessionFactoryBuilder解析mybatis-config.xml开始 对文件流解析 XMLConfigBuilder ...
- javascript一些常用操作
一:验证日期 1:日期必须满足yyyy-MM-dd格式 2:日期必须是合法的日期,如2016-02-30就是不存在 //验证就诊日期 function checkVisitDate(date){ va ...
- Java二叉搜索树实现
树集合了数组(查找速度快)和链表(插入.删除速度快)的优点 二叉树是一种特殊的树,即:树中的每个节点最多只能有两个子节点 二叉搜索树是一种特殊的二叉树,即:节点的左子节点的值都小于这个节点的值,节点的 ...
- [转]HTML accesskey 属性
本文转自:http://www.dreamdu.com/xhtml/attribute_accesskey/ 17.2. HTML accesskey 属性 accesskey 属性 -- 代表链 ...
- LeetCode 11
Container With Most Water Given n non-negative integers a1, a2, ..., an, where each represents a poi ...
- Java汉字转成汉语拼音工具类
Java汉字转成汉语拼音工具类,需要用到pinyin4j.jar包. import net.sourceforge.pinyin4j.PinyinHelper; import net.sourcefo ...
- Hive的JDBC使用&并把JDBC放置后台运行
使用JDBC访问HIVE: 首先启动hive的JDBC服务. 进入hive的bin目录: 这样启动是启动到前台.如果 要想启动到后台需要用到Linux的相关命令. 我们先把其放到前台看下效果,之后再把 ...