点击另一个元素时不要失去焦点 [英] Don't lose focus when clicking another element
问题描述
contenteditable
元素,出现一个小的工具栏。当单击工具栏时,正在编辑的元素短时间内失去焦点。有没有办法避开这个? (这实际上是一个用户体验问题)<2>当
blur
时,工具栏应该消失。但是这会导致工具栏不起作用。如果您点击工具栏上的某些内容,会发生 blur
事件...当用户点击工具栏时,最好的做法是不要模糊。 在此先感谢,
Sebastian
解决方案非常简单...只需添加一个超时保护菜单。 (b)
protect:function(e){
e.preventDefault()
return setTimeout (300)
}
I am coding a small "in-place-editor" for a project, but ran into two problems with keeping the focus and bluring. I made a fiddle to explain my problem better:
http://jsfiddle.net/distractedBySquirrels/ufbtC/
(1) When you click inside an contenteditable
element, a small toolbar appears. When clicking the toolbar the element, which is currently under editing loses focus for a short time. Is there a way to circumvent that? (It's actually rather an UX problem)
(2) The toolbar should disappear when blur
. But this causes the toolbar to not work. If you click something on the toolbar the blur
event occurs... what is the (kinda) best practice to not blur when a user is clicking the toolbar?
Thanks in advance,
Sebastian
The solution is pretty simple... just add an timeout to "protect the menu". Updated the fiddle.
protect: function (e) {
e.preventDefault()
return setTimeout(300)
}
这篇关于点击另一个元素时不要失去焦点的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!