自定义按钮删除焦点点击，但不是在输入按键

什么是最好的方法来删除从鼠标点击按钮的焦点，但不是当使用Javascript按下Enter键时？我在click事件上使用blur()方法，但这不起作用。自定义按钮删除焦点点击，但不是在输入按键

请注意，由于辅助功能的原因，我不能使用outline: none或outline: 0。欲了解更多信息请参阅：http://www.outlinenone.com/

var button = document.getElementById("btn"); 
 
button.addEventListener("click", removeFocus); 
 

 
function removeFocus(event) { 
 
\t event.target.blur(); 
 
}

button { 
 
    display: inline-block; 
 
    border: none; 
 
    height: 36px; 
 
    line-height:36px; 
 
    padding: 0 12px; 
 
    background: cyan; 
 
}

<button id="btn"> 
 
    Hello 
 
</button>

来源

2016-10-03 takeradi

大纲是什么原因造成这一点，如果你不能删除它们，我不不认为有另一种方式 –

我不认为这是准确的。 stackoverflow网站本身就是这样做的。尝试点击在stackoverflow的头上的任何项目，你不会看到任何大纲样式，并尝试使用键盘导航和点击，你会看到一个。 – takeradi

JavaScript解决方案

var button = document.getElementById("btn"); 
 
button.addEventListener("click", clickEvent); 
 
button.addEventListener("keypress", clickEvent); 
 
function clickEvent(event){ 
 
    if (event.keyCode == 13) { 
 
    event.preventDefault(); 
 
    } else { 
 
    button.blur(); 
 
    } 
 
}

button { 
 
    display: inline-block; 
 
    border: none; 
 
    height: 36px; 
 
    line-height:36px; 
 
    padding: 0 12px; 
 
    background: cyan; 
 
}

<button id="btn"> 
 
    Hello 
 
</button>

来源

2016-10-03 23:41:17 Robiseb

自定义按钮删除焦点点击，但不是在输入按键

回答

相关问题