Có ai biết một trình duyệt chéo, giải pháp đáng tin cậy để đánh bắt các phím bấm của phím tab trong một trường văn bản và thay thế (ở vị trí chính xác) 4 dấu cách không? Textarea đang được sử dụng để nhập một bài luận và cần tính năng này.Bắt các tab trong TextArea
Lưu ý: Tôi đã thử sử dụng FCKEditor, trong số những thứ khác, không bắt được tab và có nhiều tính năng mà tôi không cần. Tôi muốn có một giải pháp đơn giản chỉ để bắt các tab.
Tôi không thử nghiệm rộng rãi, nhưng điều này dường như làm việc:
(Tôi tìm thấy "insertAtCursor" chức năng tại http://alexking.org/blog/2003/06/02/inserting-at-the-cursor-using-javascript#comment-3817)
<textarea id="text-area" rows="20" cols="100"></textarea>
<script>
document.getElementById("text-area").onkeydown = function(e) {
if (!e && event.keyCode == 9)
{
event.returnValue = false;
insertAtCursor(document.getElementById("text-area"), " ");
}
else if (e.keyCode == 9)
{
e.preventDefault();
insertAtCursor(document.getElementById("text-area"), " ");
}
};
//http://alexking.org/blog/2003/06/02/inserting-at-the-cursor-using-javascript#comment-3817
function insertAtCursor(myField, myValue) {
//IE support
if (document.selection) {
var temp;
myField.focus();
sel = document.selection.createRange();
temp = sel.text.length;
sel.text = myValue;
if (myValue.length == 0) {
sel.moveStart('character', myValue.length);
sel.moveEnd('character', myValue.length);
} else {
sel.moveStart('character', -myValue.length + temp);
}
sel.select();
}
//MOZILLA/NETSCAPE support
else if (myField.selectionStart || myField.selectionStart == '0') {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length);
myField.selectionStart = startPos + myValue.length;
myField.selectionEnd = startPos + myValue.length;
} else {
myField.value += myValue;
}
}
</script>
EDIT: Modified kịch bản nên nó doesn' t sử dụng jQuery.
Có lý do nào khiến bạn không thể thay thế các tab sau khi quá trình chỉnh sửa được thực hiện không? Tôi đã chơi xung quanh khá một chút với việc thay thế văn bản trong khi gõ vào một textarea, và thấy nó là ... không thực tế tốt nhất.
Vấn đề là người dùng có thể chèn "tab" khi sử dụng trang, nhưng theo mặc định, các chu kỳ khóa tab sẽ tập trung vào phần tử tiếp theo. – user122147
Sau đó, bạn đang tham gia vào việc triển khai trên nhiều trình duyệt của onkeydown, đó là điều tôi chưa bao giờ đủ dũng cảm để thử. Chúc may mắn! – Dave
<html>
<head>
<script type="text/javascript">
function keyHandler(e) {
var TABKEY = 9;
var backSlash = 8;
var code = e.keyCode ? e.keyCode : e.charCode ? e.charCode : e.which;
if(code == TABKEY && !e.shiftKey && !e.ctrlKey && !e.altKey) {
var val = document.getElementById("t1");
val.value=(val.value).substring(0,getCaret(val)) + " " + (val.value).substring(getCaret(val));
//document.getElementById("t1").value += " ";
if(e.preventDefault) {
e.preventDefault();
} else {
e.returnValue = false;
}
val.focus();
return false;
}
if(code == backSlash) {
var val = document.getElementById("t1");
val.value=(val.value).substring(0,getCaret(val)-4) + (val.value).substring(getCaret(val));
if(e.preventDefault) {
e.preventDefault();
} else {
e.returnValue = false;
}
return false;
}
}
function getCaret(el) {
if (el.selectionStart) {
return el.selectionStart;
} else if (document.selection) {
el.focus();
var r = document.selection.createRange();
if (r == null) {
return 0;
}
var re = el.createTextRange(),
rc = re.duplicate();
re.moveToBookmark(r.getBookmark());
rc.setEndPoint('EndToStart', re);
return rc.text.length;
}
return 0;
}
</script>
</head>
<body>
<textarea id="t1" onkeydown="javascript:keyHandler(event)"></textarea>
</body>
</hrml>
Có thể nhân đôi http://stackoverflow.com/questions/3362/capturing-tab-key-in-text-box – freitass
Đó giải pháp không hoạt động nội tuyến (nếu tab xảy ra ở giữa của chuỗi) Tôi nghĩ rằng – user122147