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的高度不会随着 ...
随机推荐
- debian分区方案(就这个看着靠谱点)转
debian分区方案(就这个看着靠谱点)转 桌面系统/tmp 1G (仅用作临时文件) ext3/ext4/home Max (用户目录数据) ext3/ext4/usr 20G (软件) ext3/ ...
- Linux c编程实例_例子
例一:字符与整型变量的实现 #include <stdio.h> int main() { int c1,c2; char c3; c1='a'-'A'; c2='b'-'B'; c3=; ...
- 琐碎-同步centos集群的时间
想马上上手HBase,其对集群时间同步要求很高,当然,hadoop也是
- iptables常用命令
常规: iptables -t filter -A INPUT -d -p tcp --dport -j DROPiptables -A INPUT -m iprange --src-range 22 ...
- css笔记13:display用法
1.代码演示: element.html如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
- reset.css(详细说明)
@charset "utf-8";/************************************************************************ ...
- [改善Java代码]Java的泛型是类型擦除的
泛型可以减少强制类型的转换,可规范集合的元素类型,还可以提高代码的安全性和可读性,正是因为有了这些优点,自从Java引入泛型之后,项目的编码规则上便多了一条,优先使用泛型. Java泛型(Generi ...
- 软谋在线教育诚招php,java,.net,设计师讲师(可兼职)
软谋教育专注软件在线教育,依托腾讯课堂.yy课堂授课,在线教授计算机知识,现因业务发展,招聘php,java,.net,设计师讲师各两名,如果您满足以下条件,即可联系我们应聘: 1.相关专业工作经验3 ...
- C#算法基础之递归排序
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- C标准库函数实现之strstr(转)
看下Linux下的实现: char *strstr(const char *s1, const char *s2) { size_t l1, l2; l2 = strlen(s2); if (!l2) ...