原理嘛: 我们对所有 textarea 元素绑定 onkeydown 事件,截获tab按键行为,通过js操作文本实现缩进,阻止默认的tab事件。
借助于jQuery,实现了一下:
//textarea支持tab缩进$("textarea").on('keydown',function(e){ if(e.keyCode == 9){ e.preventDefault(); var indent = ' '; var start = this.selectionStart; var end = this.selectionEnd; var selected = window.getSelection().toString(); selected = indent + selected.replace(/\n/g,'\n'+indent); this.value = this.value.substring(0,start) + selected + this.value.substring(end); this.setSelectionRange(start+indent.length,start+selected.length); }})
支持多行缩进