The position of cursor

I have a page at
When it is loading, the cursor is in front of “1”.

I like to make the cursor is in front of “12” when it is loading.
After I read the page at I made a page at

I am disappointed because the cursor is not located in front of “12”.
Can I make the cursor to locate in front of “12” with your help?

Hi @joon1, if you open the console of your browser dev tools you’ll see an

… because you’re trying to use a number as parameter name, which should probably be passed as an argument instead; furthermore, you’re not actually calling FocusMe() at any point. And if you were, you’d get a type error because you misspelled getElemenById() in line 34, and then a reference error because you forgot to copy / paste the setSelRange() function from that SO thread. After fixing those issues it should work as expected.

1 Like

I fixed it at

Do you mean I should use a text as parameterName like the code below?

function FocusMe(anotherName){ 
 var cFocus = document.getElementById("myarea").innerHTML;
 var pos = cFocus.indexOf(anotherName);
 setSelRange(document.getElementById('myarea'), pos, pos); 

I have a page with the code above at
But it seems not to focus on the line “anotherName”.

What error messages are you getting in the console?

No error messages I am getting in the console of at the moment

Hi there joon1,

does this help…

<html lang="en">

<meta charset="utf-8">
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">

<title>Untitled document</title>


<textarea id="myarea" rows="30">

(function( d ) {
   'use strict';
   var cFocus, pos, tarea = d.getElementById( 'myarea' );
       cFocus = tarea.textContent;
       pos = cFocus.indexOf( 12 );
       tarea.setSelectionRange( tarea, pos, pos );
}( document ));



That would be syntactically correct, but you’re still confusing the function parameter (in this case, a variable with the name anotherName) with the arguments you want to pass to the function (such as the string "anotherName" or the number 12); also you’re still not calling the function. Consider:

function foo (bar) {
  console.log('You passed the value', bar)

foo('someText') // -> You passed the value someText
foo(12)         // -> You passed the value 12

So your function call would have to be focusMe('anotherName')… see here for a general introduction to functions in JS:

(BTW function names should start lower cased if they are not a constructor functions).

I made with your code.
It works for designating which is ready to cut or copy.

I don’t want to designate for ready to cut or copy.

I want to locate my cursor on the line 12 instead on the line 1 at

Then why were you using that script? :rolleyes:

What you need to search for is…

JavaScript set caret position in textarea :biggrin:


1 Like

I am sorry it is a good code for my purpose because my cursor can be easily located at line 12 of as I move the cursor slightly toward right with right arrow. key.
Thank you for the code.

Here, I meet another problem.
Please look the page at
The page cursorBlock2 is still good.
But at, the cursor block is ended on the line 7 because there is a text “12” after the text “gggg” instead of the line number “『12』”.

“12” on the line number 7 is not a line number but a text.

I like to make it locate on the line number 12 only.
Can I make it with your help?

I think you got something mixed up here; setSelectionRange() takes the start and end position as the first and second argument, respectively – not the textarea on which you’re already calling the method.

If you want to place the caret at line number 12, I wouldn’t search for the string "12" at all; instead, you might split() the text by line feeds, and get the length of the string from join()ing the first n substrings:

var textarea = document.getElementById('myarea')

var linePosition = textarea.value
  .slice(0, 11)
  .length + 1

textarea.selectionStart = linePosition

// Or, parameterized:
function getLinePosition (element, line) {
  return element.value
    .slice(0, line)
    .length + 1

textarea.selectionStart = getLinePosition(textarea, 11)

(Note that in most programming languages you start counting with zero, so you’re actually looking for line number 11.)

Hi there joon1,

you can see a caret positioning example here…

All the files used may be found in the attachment… (2.1 KB)