move cursor to the beginning of the input field?
when you click on 'Ask question' here in Stackoverflow you see a text "What's your programming question? Be descriptive."
i want the same thing and all i need for that is to move my cursor to the beginning of the text field. how do i do that with jquery?
Solution 1:
May be that is an overkill, but these functions are helpful to select a portion of an input field.
The code below place the cursor to the first char of the second field.
<html>
<head>
<title>so</title>
</head>
<body>
<input value="stack" />
<input value="overflow" />
<script>
var inp = document.getElementsByTagName('INPUT')[1];
if (inp.createTextRange) {
var part = inp.createTextRange();
part.move("character", 0);
part.select();
} else if (inp.setSelectionRange) {
inp.setSelectionRange(0, 0);
}
inp.focus();
</script>
</body>
</html>
Solution 2:
You can use focus() method. If I recall jQuery, its like this: $("#question_input_field_id").focus(); (If I got your question right)
Update: Setting cursor at the beginning:
$("#question_input_field_id").focus();
$("#question_input_field_id").get(0).setSelectionRange(0,0);
Solution 3:
if you look into the source code of stackoverflow > ask question, you will find this:
<table style="width:668px">
<tr>
<td style="width:50px"><label for="title">Title</label></td>
<td style="padding-left:5px"><input id="title" name="title" type="text" maxlength="300" tabindex="100" style="width:610px" value="">
<span class="edit-field-overlay">What's your programming question? Be descriptive.</span>
</td>
</tr>
</table>
what really is happening is that a CSS code made the <span class="edit-field-overlay">
move over the top of input box and show hide when needed... and just do what Sejanus' suggested.