내가 세 contenteditable 된 div를하고 난 알고 싶지는커서 또는 캐럿이있는 div를 얻는 방법은 무엇입니까? 사용자를 div에있는
<div contenteditable="true"></div>
<div contenteditable="true"></div>
<div contenteditable="true"></div>
누군가가 나를 도울 수, 커서를 배치 또는 탭 키 또는 마우스 클릭을 통해 캐럿있다?
내가 일 더 나은 해결책을 내려면,이 w 병이 필요 당신이 부모 div 태그에 커서를 확인하려는 모든 div 태그를 둘러싸고 우리가
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<div id=parent>
<div contenteditable="true" id=1>dddd
</div>
<div contenteditable="true" id=2>dddd
</div>
<div contenteditable="true" id=3>dddd
</div>
</div>
<input type="label" id="showRes"></input>
</body>
<script type="text/javascript">
var div = document.getElementsByTagName('div');
var out=document.getElementById('parent');
function findCursor(){
var x=document.getSelection();
var r=x.getRangeAt(0);
var tempnode=document.createElement("div");
tempnode.setAttribute("id","cursorhook");
r.surroundContents(tempnode);
document.getElementById('showRes').value=tempnode.parentNode.id;
document.getElementById(tempnode.parentNode.id).removeChild(document.getElementById("cursorhook"));
}
out.onkeyup=findCursor;
out.onclick=findCursor;
</script>
</html>
document.activeElement을 사용하십시오. 이는 현재 페이지에 포커스가있는 요소를 반환합니다. (MDN) 당신이 요소를 회피 할 때마다 트리거
HTML 문서에서 작동합니다. xml에서는 coz가 작동하지 않습니다. –
사용 onfocus 이벤트 ...
예 :
var div = document.getElementsByTagName('div');
for(var i=0;i<div.length;i++)
div[i].addEventListener('focus',function(){document.getElementById('showRes').value = this.id;},false);
HTML :
<div contenteditable="true" id=1></div>
<div contenteditable="true" id=2></div>
<div contenteditable="true" id=3></div>
<input type="label" id="showRes"></input>
죄송가 있었다 커서 또는 캐럿이 배치되어있는 DIV의 ID를 얻을 수있는
document.getSelection()객체를 사용하여 서두르다가 오타를 만들었습니다 –