JS在TextArea光標(biāo)位置插入文字并實(shí)現(xiàn)移動(dòng)光標(biāo)到文字末尾
更新時(shí)間：2013年06月21日 16:28:12 作者：
JS在TextArea光標(biāo)位置插入文字+移動(dòng)光標(biāo)到文字末尾，F(xiàn)irefox，Chrome,Safari以及Opera都有selectionStart和selectionEnd屬性，具體實(shí)現(xiàn)如下，感興趣的朋友可以參考下哈
=IE支持document.selection
=Firefox，Chrome,Safari以及Opera都有selectionStart和selectionEnd屬性
function insertText(obj,str) {
if (document.selection) {
var sel = document.selection.createRange();
sel.text = str;
} else if (typeof obj.selectionStart === 'number' && typeof obj.selectionEnd === 'number') {
var startPos = obj.selectionStart,
endPos = obj.selectionEnd,
cursorPos = startPos,
tmpStr = obj.value;
obj.value = tmpStr.substring(0, startPos) + str + tmpStr.substring(endPos, tmpStr.length);
cursorPos += str.length;
obj.selectionStart = obj.selectionEnd = cursorPos;
} else {
obj.value += str;
}
}
function moveEnd(obj){
obj.focus();
var len = obj.value.length;
if (document.selection) {
var sel = obj.createTextRange();
sel.moveStart('character',len);
sel.collapse();
sel.select();
} else if (typeof obj.selectionStart == 'number' && typeof obj.selectionEnd == 'number') {
obj.selectionStart = obj.selectionEnd = len;
}
}
<input type="button" onclick="insertText(document.getElementById('text'),' 新文字—YoyiorLee ')" value="插入文字"></input>
<input type="button" onclick="moveEnd(document.getElementById('text'))" value="移到末尾"></input>
=Firefox，Chrome,Safari以及Opera都有selectionStart和selectionEnd屬性
復(fù)制代碼 代碼如下:
function insertText(obj,str) {
if (document.selection) {
var sel = document.selection.createRange();
sel.text = str;
} else if (typeof obj.selectionStart === 'number' && typeof obj.selectionEnd === 'number') {
var startPos = obj.selectionStart,
endPos = obj.selectionEnd,
cursorPos = startPos,
tmpStr = obj.value;
obj.value = tmpStr.substring(0, startPos) + str + tmpStr.substring(endPos, tmpStr.length);
cursorPos += str.length;
obj.selectionStart = obj.selectionEnd = cursorPos;
} else {
obj.value += str;
}
}
function moveEnd(obj){
obj.focus();
var len = obj.value.length;
if (document.selection) {
var sel = obj.createTextRange();
sel.moveStart('character',len);
sel.collapse();
sel.select();
} else if (typeof obj.selectionStart == 'number' && typeof obj.selectionEnd == 'number') {
obj.selectionStart = obj.selectionEnd = len;
}
}
復(fù)制代碼 代碼如下:
<input type="button" onclick="insertText(document.getElementById('text'),' 新文字—YoyiorLee ')" value="插入文字"></input>
復(fù)制代碼 代碼如下:
<input type="button" onclick="moveEnd(document.getElementById('text'))" value="移到末尾"></input>
您可能感興趣的文章:
- JS在可編輯的div中的光標(biāo)位置插入內(nèi)容的方法
- js獲取光標(biāo)位置和設(shè)置文本框光標(biāo)位置示例代碼
- 用javascript獲取textarea中的光標(biāo)位置
- 用javascript獲取當(dāng)頁面上鼠標(biāo)光標(biāo)位置和觸發(fā)事件的對(duì)象的代碼
- JavaScript 獲取/設(shè)置光標(biāo)位置,兼容Input&&TextArea
- javascript獲得光標(biāo)所在的文本框(text/textarea)中的位置
- textbox 在光標(biāo)位置插入字符功能的js實(shí)現(xiàn)(兼容ie,firefox)
- javascript控制在光標(biāo)位置插入文字適合表情的插入
- Javascript實(shí)現(xiàn)獲取及設(shè)置光標(biāo)位置的方法
- 往光標(biāo)所在位置插入值的js代碼
- js實(shí)現(xiàn)的光標(biāo)位置工具函數(shù)示例
相關(guān)文章
詳解JavaScript中的強(qiáng)制類型轉(zhuǎn)換
這篇文章主要介紹了JavaScript中的強(qiáng)制類型轉(zhuǎn)換，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
在javascritp中，有兩個(gè)關(guān)于定時(shí)器的專用函數(shù)，下面講解一下兩個(gè)定時(shí)器，有需要的朋友可以參考一下2013-10-10
js中的scroll和offset 使用比較的實(shí)例與分析
這篇文章介紹了js中的scroll和offset使用比較的實(shí)例與分析，有需要的朋友可以參考一下2013-09-09
Javascript Request獲取請(qǐng)求參數(shù)如何實(shí)現(xiàn)
使用Javascript Request獲取參數(shù)的時(shí)候總是提示出錯(cuò)，本文為此問題提供詳細(xì)的解決方案，需要了解的朋友可以參考下2012-11-11
JavaScript使用百度ECharts插件繪制餅圖操作示例
這篇文章主要介紹了JavaScript使用百度ECharts插件繪制餅圖操作,結(jié)合實(shí)例形式分析了JavaScript使用百度ECharts插件繪制餅圖的原理、步驟及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2019-11-11
網(wǎng)頁爬蟲之cookie自動(dòng)獲取及過期自動(dòng)更新的實(shí)現(xiàn)方法
這篇文章主要介紹了網(wǎng)頁爬蟲之cookie自動(dòng)獲取及過期自動(dòng)更新的實(shí)現(xiàn)方法,需要的朋友可以參考下2018-03-03
JS解決Date對(duì)象在IOS中的“大坑” 以及時(shí)間格式兼容問題
這篇文章主要介紹了JS解決Date對(duì)象在IOS中的“大坑” 以及時(shí)間格式兼容問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10
本文我們將討論?axios?中是如何處理異常的,在此之前,我們先了解以下?axios?中各種類型的異常,文中通過代碼示例講解的非常詳細(xì),具有一定的參考價(jià)值,需要的朋友可以參考下2024-05-05
這篇文章主要為大家詳細(xì)介紹了js仿3366小游戲選字游戲2016-04-04
window.showModalDialog參數(shù)傳遞中含有特殊字符的處理方法
程序運(yùn)行出錯(cuò)經(jīng)，過檢查發(fā)現(xiàn)傳遞的數(shù)據(jù)中出現(xiàn)了#等特殊字符，瀏覽器只取到#號(hào)前面的數(shù)據(jù)，后面的被截?cái)?，下面為大家介紹下正確的處理方法2013-06-06