SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    50
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question shift cursor position

    Hello,
    Let there be a textbox in an html page
    <input type='text' ... ... ...value='Hello How Are You ? ' />
    if I want to set focus on this textbox when the page gets loaded, I have to write the code
    <body onload="document.getElementById('...').focus();">
    Now if I want to set the cursor to a particular position (like After How or after the end of the text Hello How Are You ?),
    What javascipt code should I write ?

  2. #2
    SitePoint Addict
    Join Date
    Aug 2006
    Posts
    266
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    First code is working on Firefox, Opera and Internet Explorer.
    Code:
      
    <html>
    <head>      
    </head>
    <body>
    	<div>
    		<input id="myDeger" type="text" value="5" size="20"><input type="button" value="sıradaki karaktere git" onclick="konumlandir(myKutu,myDeger.value);">
    	</div>
    	<textarea id="myKutu" name="myKutu" rows="3" cols="30" style="height: 300px; width: 300px">abcdefg</textarea>
    <script>
    function konumlandir(kutu,posizyon) {
    myKutu.focus();
       	       if( kutu.setSelectionRange ) {
        	         kutu.setSelectionRange(posizyon,posizyon);
                 } 
                 else if( kutu.createTextRange ) {
                    var aralik = kutu.createTextRange();
                    aralik.collapse(true);
                    aralik.moveEnd('character',posizyon);
                    aralik.moveStart('character',posizyon);
                    aralik.select();
                 }
           }
        </script>
    </body>
    </html>
    Code:
      
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
       <html>
       <head>
       <title>Untitled</title>
       <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
       
       <script type="text/javascript">
       function kursor () {
       var el = document.getElementById('textareaid');
       el.focus();
       el.setSelectionRange(el.value.length,el.value.length); 
       alert(el.selectionStart+"\n"+el.selectionEnd)   
       return false;
       
       
       }
       
       </script>
       </head>
       <body>
    
       <textarea id="textareaid">now is the time</textarea>
       <br />
       <a href="#"
         onclick="kursor ()">
         position cursor w/setSelectionRange
       </a>
       <br /><br />
       </body>
       </html>
    Code:
     
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
       <html>
       <head>
       <title>Untitled</title>
       <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
       
       <script type="text/javascript">
       function kursor () {
       var el = document.getElementById('textareaid');
       el.focus();
       el.setSelectionRange(3,3); 
       alert(el.selectionStart+"\n"+el.selectionEnd)   
       return false;
       
       
       }
       
       </script>
       </head>
       <body>
       <textarea id="textareaid">now is the time</textarea>
       <br />
       <a href="#"
         onclick="kursor ()">
         position cursor w/setSelectionRange
       </a>
       <br /><br />
       </body>
       </html>
    http://vebgelistirme.googlepages.com/jseditor.htm
    Last edited by muazzez; May 31, 2007 at 12:30.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •