问题:如果当前activeElement为input#1
,则在按Tab键时它会跳转到input#2
,但我想防止整个div[tabindex=-1]
带有子项专注。
<div>
<input id="1" type="text"> // jump from here
<div tabindex="-1">
<input id="2" type="text">
<input id="3" type="text">
</div>
</div>
<button>any focusable element</button> // to here
如果下一个可聚焦元素未知,如何实现?
答案 0 :(得分:0)
您可以将其用于此contenteditable
属性,然后在失去焦点后将其禁用
function edit(e){
e.target.setAttribute("contenteditable",true);
}
function unedit(e){
e.target.setAttribute("contenteditable",false);
}
[].slice.call( document.querySelectorAll(".unselect > div"),0).forEach((el)=>{
el.addEventListener("click",edit);
el.addEventListener("blur",unedit);
})
<div>
<input id="1" type="text"> // jump from here
<div tabindex="-1" class="unselect">
<div id="2" >editable</div>
<div id="3" >editable</div>
</div>
<input id="4" type="text"> // jump from here
</div>