我在页面上有一个 div,显示有关特定类别(图像、名称等)的一些信息。
当我单击编辑图像时,它会将类别置于编辑模式,允许我更新名称。从下图中可以看出,“Soup”当前处于编辑模式,其他处于正常视图模式。这一切都按预期工作,取消/保存按钮一切正常。(我尝试添加图像但不让我,需要更多的爱)
但是,一旦进入编辑模式,如果我单击页面上的任何其他位置(div 之外),预期的结果将是汤类别将返回查看模式。在某种事件触发时,这也应该允许我询问他们是否要保存更改。
所以我决定做的是在“汤”父 div 上创建一个模糊事件。如果我单击页面上的任何位置,这将按预期工作,但是如果我单击 div 的内部元素,它也会导致触发父模糊事件,从而导致类别返回查看模式。
那么,如果父 div 的任何一个子元素获得焦点,有没有办法阻止父 div 触发 blur 事件?
<div tabindex="-1" onblur="alert('outer')">
<input type="text" value="Soup" />
</div>
我只是在没有编译器的情况下编写了代码,所以不确定它是否有效,但希望你能明白这一点。
我正在使用 Knockout.js 即时更新 GUI,但这不应该影响我没想到的答案。