현재 텍스트 선택을 안전하게 허용하는 유일한 요소는 다음과 같습니다.
<input type="text|search|password|tel|url">설명 :
whatwg : selectionStart 속성 .
HTMLInputElement 인터페이스 에 대한 설명서를 읽고 입력 요소를 자세히 살펴볼 수도 있습니다.
이 "문제"를 안전하게 극복하기 위해 현재 가장 좋은 방법은 <input type="text">숫자 만 허용하는 마스크 / 제약 조건을 처리 하고 적용하는 것입니다. 요구 사항을 충족하는 몇 가지 플러그인이 있습니다.
여기에서 이전 플러그인 중 하나의 라이브 데모를 볼 수 있습니다.
안전하게 사용하려면이를 selectionStart지원하는 요소를 확인할 수 있습니다 ( 입력 유형 속성 참조 ).
이행
var _fixSelection = (function() {
var _SELECTABLE_TYPES = /text|password|search|tel|url/;
return function fixSelection (dom, fn) {
var validType = _SELECTABLE_TYPES.test(dom.type),
selection = {
start: validType ? dom.selectionStart : 0,
end: validType ? dom.selectionEnd : 0
};
if (validType && fn instanceof Function) fn(dom);
return selection;
};
}());
function getCaretPosition (dom) {
var selection, sel;
if ('selectionStart' in dom) {
return _fixSelection(dom).start;
} else {
selection = document.selection;
if (selection) {
sel = selection.createRange();
sel.moveStart('character', -dom.value.length);
return sel.text.length;
}
}
return -1;
}
용법
var box = document.getElementById("price"),
pos = getCaretPosition(box);
console.log("position: ", pos);
위의 예제는 여기에서 찾을 수 있습니다 : jsu.fnGetCaretPosition ()
