Javascript實現(xiàn)獲取及設(shè)置光標(biāo)位置的方法
更新時間：2015年07月21日 12:19:01 作者：華宰
這篇文章主要介紹了Javascript實現(xiàn)獲取及設(shè)置光標(biāo)位置的方法,涉及javascript針對頁面光標(biāo)位置的相關(guān)操作技巧,具有良好的兼容性,非常簡單實用,需要的朋友可以參考下
本文實例講述了Javascript實現(xiàn)獲取及設(shè)置光標(biāo)位置的方法。分享給大家供大家參考。具體如下：
在項目開發(fā)中經(jīng)常遇到input等設(shè)置光標(biāo)位置到最后的問題，今天我查了一下Google，找到了在IE、Firefox、Opera等主流瀏覽器的獲取光標(biāo)位置（getCursortPosition）以及設(shè)置光標(biāo)位置（setCursorPosition）的函數(shù)。
1. 獲取光標(biāo)位置函數(shù)：
function getCursortPosition (ctrl) {
var CaretPos = 0; // IE Support
if (document.selection) {
ctrl.focus ();
var Sel = document.selection.createRange ();
Sel.moveStart ('character', -ctrl.value.length);
CaretPos = Sel.text.length;
}
// Firefox support
else if (ctrl.selectionStart || ctrl.selectionStart == '0')
CaretPos = ctrl.selectionStart;
return (CaretPos);
}
2. 設(shè)置光標(biāo)位置函數(shù)：
function setCaretPosition(ctrl, pos){
if(ctrl.setSelectionRange)
{
ctrl.focus();
ctrl.setSelectionRange(pos,pos);
}
else if (ctrl.createTextRange) {
var range = ctrl.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
}
希望本文所述對大家的javascript程序設(shè)計有所幫助。
相關(guān)文章
ie6,7下js動態(tài)加載圖片不顯示錯誤，碰到這類問題的朋友可以參考下。2010-07-07
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)聯(lián)動選擇器，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-02-02
這篇文章主要為大家詳細(xì)介紹了移動端手指操控左右滑動的菜單，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-09-09
JS自定義函數(shù)對web前端上傳的文件進(jìn)行類型大小判斷
這篇文章主要介紹了JS自定義函數(shù)對web前端上傳的文件進(jìn)行類型大小判斷的相關(guān)資料,需要的朋友可以參考下2016-10-10
這篇文章是JavaScript插件化開發(fā)系列教程的第五篇，還是著重于實戰(zhàn)，通過具體的實例來學(xué)習(xí)jQuery的方式如何開發(fā)插件，有相同需求的小伙伴來參考下吧。2015-02-02
微信小程序Page中data數(shù)據(jù)操作和函數(shù)調(diào)用方法
這篇文章主要介紹了微信小程序Page中data數(shù)據(jù)操作和函數(shù)調(diào)用，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
下面小編就為大家?guī)硪黄狫avaScipt選取文檔元素的方法(推薦)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-08-08
js中火星坐標(biāo)、百度坐標(biāo)、WGS84坐標(biāo)轉(zhuǎn)換實現(xiàn)方法示例
這篇文章主要介紹了js中火星坐標(biāo)、百度坐標(biāo)、WGS84坐標(biāo)轉(zhuǎn)換實現(xiàn)方法,涉及JavaScript數(shù)值計算相關(guān)操作技巧,需要的朋友可以參考下2020-03-03
Bootstrap布局之柵格系統(tǒng)學(xué)習(xí)筆記
這篇文章主要為大家詳細(xì)介紹了Bootstrap布局之柵格系統(tǒng)的學(xué)習(xí)筆記，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-05-05
這篇文章主要為大家詳細(xì)介紹了如何實現(xiàn)簡單js計算器的方法,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-10-10