Использование jQuery / AJAX с картами изображений

Question

Я хотел бы использовать карту изображений (в частности, карту состояний США) для выполнения вызова AJAX с jQuery.

Я успешно выполнил вызов со списком выбора в форме ... потому что метод сериализации будет передавать пары имя-значение из формы. Однако я не уверен, как передавать пары имя-значение за пределы формы ... то есть с карты изображения.

Вот мой код jQuery, который работает с формой:

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

Метод сериализации передает код смещения состояния для выбранного состояния.

Каковы мои варианты передачи кода 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>