This can be done by using the focus() method and click() method. We will create a web page with a textbox and a button. We will add the functionality using jQuery such that on clicking the button, the cursor is set to the textbox.
Using jQuery With jQuery, you can use the . focus() method to trigger the “focus” JavaScript event on an element. This method is a shortcut for . trigger("focus") method.
For exactly what you're after, there's the jQuery Caret (jCaret) plugin. For your code to get the position you could do something like this: $("#myTextInput"). bind("keydown keypress mousemove", function() { alert("Current position: " + $(this).
To move the cursor to the end of an input field: Use the setSelectionRange() method to set the current text selection position to the end of the input field. Call the focus() method on the input element. The focus method will move the cursor to the end of the input element's value.
yes, catch the click event on the anchor prevent the default action and focus on the field.
the function context contains the element that has been clicked so u can compute which field to apply the focus call on.
$(anchorSelector).live("click", function(e) {
e.preventDefault();
$(fieldSelector).focus();
return false;
});
You can set where the cursor is in an input box with the selectionStart
and selectionEnd
properties. If you don't want any text to be selected, just make them equal to each other.
Here's how you might do it:
var input = $("input");
input[0].selectionStart = input[0].selectionEnd = input.val().length;
$(":input[name=xxxx]").focus();
Ah, you need the cursor to be after all the text? Take a look here: jQuery Set Cursor Position in Text Area it works the same for an input instead of a textarea.
This also works if you use other selectors.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With