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的高度不会随着 ...
随机推荐
- linux自带抓包工具tcpdump使用说明
tcpdump是个强大的网络分析工具,有很多细致的规则可以定义. 参考:http://www.cnblogs.com/ggjucheng/archive/2012/01/14/2322659.html ...
- BootStrap2学习日记12---注册表单
<form method="" action="" class="form-horizontal"> <frameset& ...
- use selenium in scrapy webdriver
https://pypi.python.org/pypi/selenium from selenium import webdriver from selenium.webdriver.common. ...
- tlb转dll
项目中需要用到c++编写的dll文件,但是同事发给我的是一个tlb后缀的文件,此时需要用到vs命令工具,具体操作如下: 开始-->vs2010-->vs命令提示(2010) ,打开后,输入 ...
- Log4Net之初步了解
原创文章,转载必需注明出处:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/log4net%E4%B9%8B%E5%88%9D%E6 ...
- 给jdk写注释系列之jdk1.6容器(6)-HashSet源码解析&Map迭代器
今天的主角是HashSet,Set是什么东东,当然也是一种java容器了. 现在再看到Hash心底里有没有会心一笑呢,这里不再赘述hash的概念原理等一大堆东西了(不懂得需要先回去看下Has ...
- MSP430常见问题之LCD 显示驱动类
Q1:晶体一般都是接32768,然后使用液晶很正常.我打算将晶体接6M的替换32768,那么液晶还能正常显示吗A1:看你所用的LCM 模块时序极限是多少HZ,然后看6M情况下,MSP430去驱动LCM ...
- 【贪心+一点小思路】Zoj - 3829 Known Notation
借用别人一句话,还以为是个高贵的dp... ... 一打眼一看是波兰式的题,有点懵还以为要用后缀表达式或者dp以下什么什么的,比赛后半阶段才开始仔细研究这题发现贪心就能搞,奈何读错题了!!交换的时候可 ...
- 用bat使用date和time命令
D:\>date /T 2010-12-10 星期五 D:\>echo %date:~0,10% 2010-12-10 date:命令(别忘记date后面有个冒号) ~0:从索引0开始取内 ...
- Sqlite官方下载对应版本注意细节
官网下载地址: http://system.data.sqlite.org/index.html/doc/trunk/www/downloads.wiki 下载注意事项: 1.对应.net平台 2.对 ...