JS在textarea光標(biāo)處插入文本的小例子
更新時(shí)間：2013年03月22日 09:30:55 作者：
本實(shí)例使用Javascript實(shí)現(xiàn)在textarea光標(biāo)處插入文本,支持多種瀏覽器
下面是代碼:
復(fù)制代碼 代碼如下:
--------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS在文本域鼠標(biāo)指定位置插入文本-柯樂義</title>
<script type="text/javascript">
function insertAtCursor(myField, myValue) {
//IE support
if (document.selection) {
myField.focus();
sel = document.selection.createRange();
sel.text = myValue;
sel.select();
}
//MOZILLA/NETSCAPE support
else if (myField.selectionStart || myField.selectionStart == '0') {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
// save scrollTop before insert www.keleyi.com
var restoreTop = myField.scrollTop;
myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length);
if (restoreTop > 0) {
myField.scrollTop = restoreTop;
}
myField.focus();
myField.selectionStart = startPos + myValue.length;
myField.selectionEnd = startPos + myValue.length;
} else {
myField.value += myValue;
myField.focus();
}
}
</script>
</head>
<body>
<div style="width:500px;margin-left:auto;margin-right:auto;margin-top:100px;">
<textarea id="keleyi_com" style="width:340px; height:180px">
柯樂義 Javascript 在textarea光標(biāo)處插入文本
</textarea>
<input type="button" onclick="insertAtCursor(document.getElementById('keleyi_com'),'www.keleyi.com')" value="插入文本" />
</div></body>
</html>
您可能感興趣的文章:
- JS簡(jiǎn)單限制textarea內(nèi)輸入字符數(shù)量的方法
- JS給Textarea文本框添加行號(hào)的方法
- JS獲取及設(shè)置TextArea或input文本框選擇文本位置的方法
- js監(jiān)聽鼠標(biāo)事件控制textarea輸入字符串的個(gè)數(shù)
- JavaScript判斷textarea值是否為空并給出相應(yīng)提示
- JavaScript中統(tǒng)計(jì)Textarea字?jǐn)?shù)并提示還能輸入的字符
- JS限制Textarea文本域字符個(gè)數(shù)的具體實(shí)現(xiàn)
- JS在TextArea光標(biāo)位置插入文字并實(shí)現(xiàn)移動(dòng)光標(biāo)到文字末尾
- JS驗(yàn)證控制輸入中英文字節(jié)長度(input、textarea等)具體實(shí)例
- JavaScript中Textarea滾動(dòng)條不能拖動(dòng)的解決方法
相關(guān)文章
swiper動(dòng)態(tài)改變滑動(dòng)內(nèi)容的實(shí)現(xiàn)方法
假設(shè)當(dāng)前顯示的是1，往左滑動(dòng)一個(gè)遞減1，往右滑動(dòng)一個(gè)遞增1。下面通過實(shí)例代碼給大家講解swiper動(dòng)態(tài)改變滑動(dòng)內(nèi)容的實(shí)現(xiàn)方法，感興趣的朋友一起看看吧2018-01-01
JS小功能(offsetLeft實(shí)現(xiàn)圖片滾動(dòng)效果)實(shí)例代碼
這篇文章主要介紹了offsetLeft實(shí)現(xiàn)圖片滾動(dòng)效果實(shí)例代碼，有需要的朋友可以參考一下2013-11-11
js實(shí)現(xiàn)點(diǎn)擊圖片自動(dòng)提交action的簡(jiǎn)單方法
下面小編就為大家?guī)硪黄猨s實(shí)現(xiàn)點(diǎn)擊圖片自動(dòng)提交action的簡(jiǎn)單方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-10-10
IE event.srcElement和FF event.target 功能比較
可以捕獲當(dāng)前事件作用的對(duì)象，如event.srcElement.tagName可以捕獲活動(dòng)標(biāo)記名稱。2010-03-03
異步是指進(jìn)程不需要一直等下去,而是繼續(xù)執(zhí)行下面的操作,不用管其他進(jìn)程的狀態(tài),下面這篇文章主要給大家介紹了關(guān)于JS異步編程方法的6種方案,需要的朋友可以參考下2023-01-01
這篇文章主要為大家詳細(xì)介紹了javascript圖片預(yù)覽和上傳的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-03-03
JavaScript實(shí)現(xiàn)的微信二維碼圖片生成器的示例
二維碼分享功能大多是由后端實(shí)現(xiàn)的,對(duì)服務(wù)器的負(fù)載較重,這里有一個(gè)前端實(shí)現(xiàn)的版本，本文介紹了JavaScript實(shí)現(xiàn)的微信二維碼圖片生成器的示例，有需要的可以了解一下。2016-10-10
JavaScript實(shí)現(xiàn)點(diǎn)擊按鈕切換網(wǎng)頁背景色的方法
這篇文章主要介紹了JavaScript實(shí)現(xiàn)點(diǎn)擊按鈕切換網(wǎng)頁背景色的方法,涉及JavaScript基于鼠標(biāo)事件動(dòng)態(tài)操作頁面元素樣式的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10
uniapp使用scroll-view實(shí)現(xiàn)左右上下滑動(dòng)功能
最近在用uni-app開發(fā)小程序時(shí),需要用scroll-view做出左右上下滑動(dòng)效果,所以下面這篇文章主要給大家介紹了關(guān)于uniapp使用scroll-view實(shí)現(xiàn)左右上下滑動(dòng)功能的相關(guān)資料,需要的朋友可以參考下2022-11-11
JavaScript判斷是否為數(shù)字的多種方法小結(jié)
這篇文章主要介紹了JavaScript判斷是否為數(shù)字的多種方法小結(jié),本文給大家分享三種方法,結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-01-01