Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Tabmaster: in-page tab navigation management
<label for="username">Username</label>
(<a id="register-link" data-tabto="reset-link" href="#">register</a>)
<input id="username" type="text" data-tabmaster="true" data-tabto="password" />
<label for="password">Password</label>
(<a id="reset-link" data-tabto="submit" href="#">reset password</a>)
<input id="password" type="password" data-tabto="register-link" />
<input id="submit" data-tabmaster="false" type="submit" value="Submit" />
var tabMaster = false;
$('body').on('focus', '[data-tabmaster]', function() {
tabMaster = $(this).attr('data-tabmaster');
});
$('body').on('keydown', '[data-tabto]', function(e) {
var target = $(this).attr('data-tabto');
if (e.which == 9 && !e.shiftKey && tabMaster == "true") {
e.preventDefault();
console.log('tab detected');
$('#' + target).focus();
} else if (e.shiftKey) {
tabMaster = false;
};
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.