如何使用Backbone.js管理元素位置属性？

Question

我有这个多人桌面游戏项目，它有一个 Board （作为Collection）和许多 Piece 对象（作为模型） *

为了向所有在线播放器显示相同的电路板，如何在玩家移动后更新 Piece position CSS属性片？

---

其他信息：

我在服务器端使用Django框架，其中每个 Piece 对象都有id，x_position和y_position属性。

Answer 1

你可以在这件作品上使用CSS类。假设您的x_position是a-z的范围而您的y_position的范围是1-8，那么

<div class="pawn <%= x_position+y_position %>">pawn</div>

你的CSS看起来像

a1 { left:0; bottom:0; }
a2 { left:0; bottom:1em; }
/* and so on */
b1 { left:1em; bottom:0; }
/* and so on */

聆听您的可拖动的stop事件，找出它所在的方格（它将为您提供ui对象中的删除位置（ui.position.left和ui.position.top）。然后您可以应用正确的CSS类更新模型，并清除draggable设置的属性。