Menu
I want my text boxes have the feature that every time users press enter, it will focus to next closest element whatsoever they are(input, checkbox, button, radio, select, a, div) as long as they can be focused. How can I do that using jquery?
799
I've already done that before. Try my solution here http://jsfiddle.net/R8PhF/3/
$(document).ready(function(){
$('#mytextbox').keyup(function(e){
var code = (e.keyCode ? e.keyCode : e.which);
if(code == 13) {
var tabables = $("*[tabindex != '-1']:visible");
var index = tabables.index(this);
tabables.eq(index + 1).focus();
}
});
});
By the way, this is a legitimate technical question and could very well be a business requirement. I have been asked to build such behavior into back office apps quite offten. There are many native apps that behave this way.
I addressed this requirement by building my form using DIVs with contenteditable=true like the example below.
<html>
<head>
<style type="text/css">
div.input { border:1px solid #aaa; width:300px; }
</style>
</head>
<body>
<div contenteditable="true" class="input"><strong>explore the world,</strong> e.g. paris, france</div>
</body>
</html>
You can the capture the key event for ENTER and simply set focus on the next sibling using JQuery.
Let me know if you need further clarification.
Hope this helps. Good Luck.
38
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
