我正在使用dust.js来将Javascript 模板呈现为HTML。使用dust.js,我基本上将我的页面分解为模板组件,这些模板组件会根据某些事件重新呈现。一个这样的组件/模板在概念上如下所示:
[标签] [输入1] [输入2] [输入3]
该组件中的所有 3 个输入都有一个 onBlur 事件,该事件用于重新计算其他输入的值,进而导致模板重新渲染。例如,如果用户修改了 Input1 的值,则 Input2 和 Input3 的值都会被调整并重新渲染。
我重新渲染模板而不只是设置值的原因是模板包含根据值渲染的附加逻辑和元素(例如,某些值会导致呈现错误消息或显示附加字段) .
到目前为止一切顺利,但这会导致焦点问题。例如,如果用户修改了 Input1,然后单击 Input2。onBlur 将触发,我将更新 Input2 和 Input3 的值,然后重新渲染模板。这反过来会导致用户的焦点被丢弃,他们将不得不再次单击 Input2。
我需要一种方法来知道用户点击了 Input2,以便在重新渲染完成后我可以将焦点设置为它。由于 onBlur 事件在 onFocus 之前触发,我想不出任何办法来做到这一点。
除了绕过模板渲染,还有什么解决办法吗?