HTML textarea에서 유사한 코드 편집기 쓰기 지원
var stopEvent = function (evt) {
if (evt.preventDefault)
evt.preventDefault();
if (evt.returnValue)
evt.returnValue = false;
return false;
};
String.prototype.trim = function () {
return this.replace(/(^\s*)|(\s*$)/g, '');
};
String.prototype.lastChar = function () {
return this.charAt(this.length - 1);
};
String.prototype.fristChar = function () {
return this.charAt(0);
};
String.prototype.toUnicode = function () {
var temp,
i = 0,
r = '',
len = this.length;
for (; i < len; i++) {
temp = this.charCodeAt(i).toString(16);
while (temp.length < 4)
temp = '0' + temp;
r += '\\u' + temp;
}
return r;
};
String.prototype.countOf = function (reg) {
if (undefined !== reg)
return (this.match(reg) || []).length;
return 0;
};
String.prototype.countOfTab = function () {
var reg = /\u0020{4}/g;
return (this.match(reg) || []).length;
};
String.prototype.countOfTabEnter = function () {
var reg = /\u0020{4}\u000a/g;
return (this.match(reg) || []).length;
};
String.prototype.countOfTabInCloseTag = function () {
var reg = /\u007b\u000a*\u0020{4}\u000a*\u007d/g;
return (this.match(reg) || []).length;
};
window.onkeydown = function (evt) {
evt = evt || window.event;
var keyCode = evt.keyCode,
tab = 9,
enter = 13;
var target = evt.target,
selectionStart = -1,
selectionEnd = -1,
tabKey = '\u0020\u0020\u0020\u0020',
doubleTabKey = tabKey + tabKey,
enterKey = '\u000a',
value = '',
prefix = '',
suffix = '';
if (target && target.tagName === 'TEXTAREA') {
selectionStart = target.selectionStart;
selectionEnd = target.selectionEnd;
value = target.value;
if (selectionStart < 0 || selectionEnd < 0) {
return;
} else {
prefix = value.substring(0, selectionStart);
suffix = value.substring(selectionEnd);
}
} else {
return;
}
//tab
if (keyCode === tab) {
value = prefix + tabKey + suffix;
selectionStart += 4;
selectionEnd = selectionStart;
target.value = value;
target.setSelectionRange(selectionStart, selectionEnd);
return stopEvent(evt);
}
//enter
if (keyCode === enter) {
//{}
var frist = prefix.trim().lastChar(),
last = suffix.trim().fristChar(),
count = prefix.countOf(/\u000a/g);
if (('\u003b' === frist || '\u0029' === frist || '\u007b' === frist) && '\u007d' === last) {
if (count === 0) {
value = prefix + enterKey + tabKey + enterKey + suffix;
selectionStart += 5;
} else if (count > 0) {
var tabs = prefix.substring(prefix.lastIndexOf('\u000a'), selectionStart).countOfTab(), i = 0, tabStr = '';
for (; i < tabs; ++i) {
tabStr += tabKey;
}
value = '';
value += prefix;
value += enterKey;
value += tabStr;
if ('\u003b' !== frist) {
value += tabKey;
++tabs;
}
if (enterKey !== suffix.fristChar()) {
value += enterKey;
value += tabStr;
}
value += suffix;
selectionStart += 1 + (tabs * 4);
}
} else {
value = prefix + enterKey + suffix;
++selectionStart;
}
selectionEnd = selectionStart;
target.value = value;
target.setSelectionRange(selectionStart, selectionEnd);
return stopEvent(evt);
}
};
현재tab키와enter키만 지원되며, 후속적으로 스마트 매칭 기능이 추가됩니다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.