使用javascript或jQuery使图像地图可选？

Question

我有一个要求，使一个圆形剧场的座位图像地图可选，很像一个复选框，有3个状态:选中，未选中和禁用。我想知道是否有办法做到这一点，以便选择的图像将成为序列化的数据库提交？

我让它只处理复选框，但我不能将它们用于客户端(他们喜欢漂亮的东西:p)

Answer 1

查看我的jquery插件ImageMapster。它正是这样做的:允许您识别图像映射中应该突出显示的区域，并可以保持状态。有许多用于渲染高光的选项，包括使用第二个图像作为高亮区域的源，以及识别在特定状态下应忽略或修复的区域。在该链接上的USA地图示例中：

阿拉斯加华盛顿州处于永久选中状态且不响应鼠标悬停事件

• 俄勒冈州处于永久取消选中状态且不响应鼠标悬停事件(这就好像它不是地图的一部分-但是可以动态更改选项，因此可能有理由在地图中包括区域但将其关闭)。

• Alaska不可选(但会响应鼠标悬停事件)

还可以指定选项，以确定每个区域高亮显示在每个区域上的显示方式。

完整的文档在github上。

如果您使用"alternate image“选项来突出显示，则插件将从第二个图像的相同区域绘制内容，以创建每个突出显示。

它使用任何HTML图像映射作为数据源。

Answer 2

为什么不直接使用jquery UI按钮呢？

http://jqueryui.com/demos/button/#icons

这可能会有帮助，而且你不需要重新编码任何东西。