快捷導(dǎo)航

JavaScript 獲取/設(shè)置光標(biāo)位置,兼容Input&&TextArea

更新時(shí)間：2011年01月01日 18:12:42 作者：

JavaScript 獲取/設(shè)置光標(biāo)位置,兼容Input&&TextArea：項(xiàng)目中遇到的問(wèn)題，特此記錄。

<!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> <title>JavaScript 獲取/設(shè)置光標(biāo)位置,兼容Input&&TextArea。</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style> body { margin: 32px; font-family: Verdana, sans-serif; font-size: 13px; } .title { font-size: 18px; font-weight: bolder;margin:40px 0; } .input { width: 50%; font-family: Verdana, sans-serif; font-size: 13px; text-indent: 2px; } </style>  </head> <body> <div   id="vvxyksv9kd"   class="title">JavaScript 獲取/設(shè)置光標(biāo)位置,兼容Input&&TextArea：</div> <div   id="vvxyksv9kd"   class="title">單行文本框</div> <p><input class="input" id="textbox" name="textbox" value="Hi,www.dbjr.com.cn!!!" /></p> <input type="button" onclick="alert( getPositionForInput( document.getElementById('textbox') ) )" value="Get Position"> 輸入位置: <input type="text" id="no1" size="1" /><input type="button" onclick="process('no1','textbox');" value="Set Position"> <div   id="vvxyksv9kd"   class="title">多行文本框</div> <textarea id="zhangdanNum" name="zhangdanNum" style="height:66px;width:246px;overflow:hidden">Hi,CssRain!!!</textarea> <input type="button" onclick="alert( getPositionForTextArea( document.getElementById('zhangdanNum') ) )" value="Get Position"> 輸入位置: <input type="text" id="no2" size="1" /><input type="button" onclick="process('no2','zhangdanNum');" value="Set Position"> </body> </html>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

您可能感興趣的文章:

光標(biāo)位置

相關(guān)文章

Javascript圖像處理—閾值函數(shù)實(shí)例應(yīng)用
閾值是最簡(jiǎn)單的圖像分割方法,接下來(lái)將介紹五種閾值類型感興趣的朋友可以參考下
2013-01-01
ajax在js中和jQuery中的用法實(shí)例詳解
Ajax被認(rèn)為是(Asynchronous(異步) JavaScript And Xml的縮寫(xiě)）,現(xiàn)在允許瀏覽器與服務(wù)器通信而無(wú)須刷新當(dāng)前頁(yè)面的技術(shù)都被叫做Ajax,下面這篇文章主要給大家介紹了關(guān)于ajax在js中和jQuery中的用法,需要的朋友可以參考下
2021-08-08
javascript 另一種圖片滾動(dòng)切換效果思路
把圖片們用ul之類的包起來(lái)，并設(shè)置float。然后設(shè)置這個(gè)ul本身為absolute定位，其父標(biāo)簽用relative定位。通過(guò)設(shè)置ul的left或top值，實(shí)現(xiàn)圖片隊(duì)列的滾動(dòng)效果
2012-04-04
javascript與asp.net(c#)互相調(diào)用方法
js與C#之間相互調(diào)用的一些方法
2009-12-12
小程序?qū)崿F(xiàn)簡(jiǎn)單吸頂效果
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)簡(jiǎn)單吸頂效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-05-05
JavaScript聲明函數(shù)的5種方法小結(jié)
本文主要介紹了JavaScript聲明函數(shù)的5種方法小結(jié)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2023-02-02
NodeJS的模塊寫(xiě)法入門(實(shí)例代碼)
前面提到了NodeJS的命令行和Web版之“Hello，World”。命令行是直接執(zhí)行hello.js文件，Web版的需要require http模塊。http模塊是NodeJS自身提供的
2012-03-03
Element-UI的?InfiniteScroll?無(wú)限滾動(dòng)組件基本使用及應(yīng)用場(chǎng)景
這篇文章主要介紹了Element-UI的InfiniteScroll無(wú)限滾動(dòng)組件基本使用,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2023-06-06
javascript css紅色經(jīng)典選項(xiàng)卡效果實(shí)現(xiàn)代碼
這篇文章主要為大家詳細(xì)介紹了javascript css紅色經(jīng)典選項(xiàng)卡效果的實(shí)現(xiàn)代碼,需要的朋友可以參考下
2016-05-05
JavaScript 中文轉(zhuǎn)拼音實(shí)現(xiàn)代碼有些bug
在做項(xiàng)目時(shí)候遇到一個(gè)小小的顯示客戶部門名稱（拼音）的業(yè)務(wù)，就是在部門名稱下有相應(yīng)的拼音，而在現(xiàn)有的數(shù)據(jù)庫(kù)中沒(méi)有相應(yīng)字段，并且部門數(shù)量比較多，添加起來(lái)比較費(fèi)時(shí)，就想能否在js中實(shí)現(xiàn)，在頁(yè)面中處理。
2010-03-03