[javascript] วิธี focus input โดยเลื่อน cursor ไปท้ายสุด

How to focus cursor mouse to end of text box or input box

สวัสดีครับ หลายคนคงเคยเขียน javascript โดยการใช้ฟังก์ชั่นง่ายๆ
อธิ focus() เมื่อสั่งคำสั่งจะพบว่า cursor ของ mouse มักจะไปอยู่หน้า input เสมอๆ  เลยครับ

หลายคนคงยังนึกภาพไม่ออก งั้นมาลองเขียน code javascript เพื่อใช้งานกันครับ

ไหนๆ ก็ไหนๆ จะขอนำเสนอ วิธีการ เลือก select box แล้ว ไป set ค่าให้กับ input box ด้วย

<select name='type' id='type' onchange='onSetV()'>
   <option value='-'>กรุณาเลือก»</option>
   <option value='0'> ที่อยู่</option>
<option value='1'> เบอร์โทร </option>
<option value='2'> อีเมล์</option>
</select>

ตัวแปลที่สำคัญ ที่เมื่อทำการ focus input แล้ว เลื่อก cursor ไปท้ายสุดคือ ตัวแดงๆ นี้ครับ
<input type='text' name='type' value='' onfocus="this.value = this.value;" >


<SCRIPT LANGUAGE="JavaScript">
<!--

 function onSetV(){
   / บรรทัดนี้ เป็นการ นำค่าใน option ของ select box ไปใส่ใน input box ครับ
   document.freqAdd.title.value = document.getElementById('type').options[document.getElementById('type').selectedIndex].text ; 
 / ทำการ focus cursor ไปที่ input box
   document.freqAdd.title.focus(); 
 }

/-->
</SCRIPT>

==============================
จริงๆ แล้วยังสามารถใช้ รูปแบบอย่าง
this.textBox.SelectionStart = this.textBox.Text.Length;

หรือฟังก์ชั่น
 

function setCursorPosToEnd (elemId)
{ 
    var elem = document.getElementById(elemId);
   
    if (elem != null) {
        var caretPos = elem.value.length; /das Ende der Textarea
        
        if (elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', caretPos);
            range.select();
        }
        else {
            if (elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(caretPos, caretPos);
            }
            else
                elem.focus();
        }
    }
}

ลองนำไปปรับใช้กันดูนะครับ

 บทความโดย คุณมีน http://www.ireallyhost.com
key :  input cursor to the end of a TextBlock element
ref : http://forums.silverlight.net/forums/t/74995.aspx
ref : http://stackoverflow.com/questions/511088/use-javascript-to-place-cursor-at-end-of-text-in-text-input-element