將遊標定位於輸入框最右側實現代碼_基礎知識

前端開發過程中，常常需要這樣的場景。以JS實現將遊標定位於輸入框最右側。

場景一：編輯圖片的描述文字

場景二：Script.aculo.us的Ajax.InPlaceEditor類別。雙擊可編輯，編輯後離開可自動更新該區域。

以上場景都需要JS實現將遊標定位於輸入框最右側，卻不是透過滑鼠點入輸入框內。

我們知道實作最基本的方法是HTMLElement的focus方法。如下

複製程式碼 程式碼如下:

<script> </script>

var input = document.getElementsByTagName('input')[0];

input.focus();

　

開啟該頁面會發現，遊標位於輸入框的最左邊。效果如下

而現在要實現的是將遊標定位於輸入框最右側，需要三個步驟。

1，呼叫focus方法

2，value賦值為空

3，之前的input的值再賦給自己

複製程式碼

程式碼如下:

<script> <BR>var input = document.getElementsByTagName('input')[0]; </script>

var val = input.value;

input.focus(); input.value = '';

input.value = val; 運行後效果如圖，遊標在深入框最右側