Question
Here on Stack Overflow, I would like to be able to use the Tab key within the WMD editor text box to tab over four spaces. The way it is now, the Tab key jumps my cursor down to the Tags.
Vote for this feature at UserVoice: http://stackoverflow.uservoice.com/pages/general/suggestions/15889
Is there some JavaScript that will capture the Tab key in the text box before it bubbles up to the UI?
I understand some browsers (i.e. FireFox) may not allow this. How about a custom key-combo like Shift+Tab, or Ctrl+Q?
Answer
Even if you capture the keydown/keyup event, those are the only events that the tab key fires, you still need some way to prevent the default action, moving to the next item in the tab order, from occurring.
In Firefox you can call the "preventDefault()" method on the event object passed to your event handler. In IE, you have to return false from the event handle. The JQuery library provides a preventDefault method on it's event object that works in IE and FF.
<body>
<input type="text" id="myInput">
<script type="text/javascript">
var myInput = document.getElementById("myInput");
if(myInput.addEventListener ) {
myInput.addEventListener('keydown',this.keyHandler,false);
} else if(myInput.attachEvent ) {
myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
}
function keyHandler(e) {
var TABKEY = 9;
if(e.keyCode == TABKEY) {
this.value += " ";
if(e.preventDefault) {
e.preventDefault();
}
return false;
}
}
</script>
</body>
0 comments:
Post a Comment