Backbone，选择性渲染模板中的部分
我将产品列为表行，每行包含用于指定产品数量的输入字段。
我在这里为它制作了一个小提琴， http://jsfiddle.net/kroofy/4jTa8/19/
正如你所看到的，在 Qty 字段中输入后，整行再次渲染。因此，输入字段的焦点将会丢失，如果您想输入的不仅仅是一位数字，或者在输入字段之间输入制表符，这并不好。
解决这个问题最优雅的方法是什么？
I am listing products as table rows, each row contains input fields for specifying the quantity of products.
I made a Fiddle for it here, http://jsfiddle.net/kroofy/4jTa8/19/
As you can see, after the input in the Qty field have been made, the whole row render again. And because of that the focus of the input field will be lost, which is not good if you want to input more than just one digit, or tab between input fields.
What would be the most elegant way to solve this?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
我将通过设置
model.set({qty: _qty}, {silent: true})来处理此问题，然后使用this.$更新非输入字段。作为静默处理的替代方法：不监听
change事件，而是监听change:qty和change:sellPrice并使用一个方法仅更新this.$中需要更新的 HTML，而不是重新渲染 DOM 对象并破坏您的焦点。不管怎样，你对小提琴的“选择性更新”的评论肯定是正确的方法。
（
this.$是 jQuery 的骨干黑客，它限制所有选择器仅在视图元素的 DOM 内搜索。该元素甚至不需要 ID 或类；它只需要存在并且视图维护它的句柄，这非常有用。）I would handle this by setting
model.set({qty: _qty}, {silent: true})and then updating the non-input fields withthis.$.As an alternative to the silent treatment: rather than listening for
changeevents, listen forchange:qtyandchange:sellPriceand have a method that updates just the HTML that needs updating withinthis.$, rather than re-rendering the DOM object and breaking your focus.Either way, your comment about "selective updating" on the fiddle is certainly the right way to go.
(
this.$is a backbone hack to jQuery that restricts all selectors to search only within the DOM of the View's element. The element doesn't even need an ID or class; it just needs to exist and the View maintains a handle to it. It's incredibly useful.)我为骨干网构建了一个名为 Backbone.ModelBinding 的插件，在这种情况下可能会有所帮助。我的插件允许您在模型更改时使用模型中的数据更新视图的部分内容。
我已经分叉/更新了你的小提琴以显示它的实际效果： http://jsfiddle.net/derickbailey/ FEcyF/6/
我删除了对模型更改的绑定。我还在表单的输入中添加了 id 属性以方便插件使用（不过插件使用的属性是可配置的）。最后，我向销售总价添加了一个
data-bind属性。你可以在这里获取插件： http://github.com/derickbailey/backbone.modelbinding/
希望有帮助
FWIW：我的插件是 Elf 建议的自动化版本。我已经多次编写了与他所描述的完全一样的代码，这就是该插件的来源。我只是厌倦了手工编写代码:)
i built a plugin for backbone called Backbone.ModelBinding that may be able to help in this situation. my plugin allows you to update portions of a view with data from a model, when the model changes.
i've forked / updated your fiddle to show it in action: http://jsfiddle.net/derickbailey/FEcyF/6/
i removed the binding to the model change. i've also added
idattributes to the inputs of the form to facilitate the plugin (the attribute that the plugin uses is configurable, though). and lastly, i've added adata-bindattribute to the sell price total td.you can get the plugin here: http://github.com/derickbailey/backbone.modelbinding/
hope that helps
FWIW: my plugin is an automated version of what Elf is suggesting. I've written code exactly like he is describing, numerous times, which is where the plugin came from. I just got tired of writing that code by hand :)