javascript - 使用客户端脚本的交互式 map

我正在寻找一个简单的Web应用程序项目，目标是当用户输入指定的数字时在图像/地图上标记一个特定的位置。

例如：假设文档上有USA地图，下面是文本字段形式。当用户键入（5）时，加利福尼亚州将处于高亮状态。

我已经看到了将鼠标悬停完成的类似技术。但是我在JS，JQ，CSS，HTML方面的技能是最大程度的“创造”。我刚才描述的场景可能吗？任何指导点/技巧/提示都将不胜感激。

谢谢

最佳答案

假设您的地图是使用Javascript和HTML创建的，那么这很容易。您将需要验证文本表单，以便每个区域都与您希望用户键入的内容相关联。因此，在您的示例中，如果用户输入（5），则需要将其链接到地图上加利福尼亚州的ID（即“加利福尼亚”）。

因此，请遵循以下期望进行哈希处理：

linkedArray = new Array();linkedArray['5'] = "california";

等等等

然后针对该数组检查您的文本框值，并拥有一个CSS类，该类可更改地图中所需元素的背景颜色，并且如果将其键入到框中，则不只是将该类添加到元素中。

for var i in linkedArray{ if linkedArray[i] == $("yourTextbox").val() { $('"' + linkedArray[i] + '"').addClass("highlighted"); }}

如果您只有Jpeg直立地图，则情况会变得复杂得多。