将 jQuery/AJAX 与图像映射结合使用

Question

我想使用图像地图（具体来说，美国州地图）通过 jQuery 执行 AJAX 调用。

我已经成功地使用表单中的选择列表执行了调用...因为序列化方法将从表单传递名称-值对。但是，我不确定如何在表单外部传递名称-值对...即从图像映射。

下面是我使用该表单的 jQuery 代码：

$('#launch').click(function(event){
         $('#results').show();
         $('#results').load('http://myprogram',
                 $('form').serialize()         
       );
          });

Serialize 方法传递选定状态的状态 fips 代码。

单击某个州时，我可以选择哪些选项来从地图传递州 fips 代码？

谢谢！

Answer 1

为保存州代码的每个州区域分配 data-fips 属性。然后为每个状态创建一个处理程序（按类或元素类型）并检测单击事件。

$('.state').click(funciton(){
    //alert($(this).data('fips'));

    //Pass in the ID to myprogram
    $('#results').load('http://myprogram',$(this).data('fips'));
});

您的状态图像/链接将如下所示：

<a href="#"><img src="state_img.png" data-fips="NY" /></a>