Добрый день!
Не часто работаю с js и вот наткнулся на следующую проблему.
Есть карта на которой происходит работа с некоторыми областями. Задача в том, чтобы сделать связку каждой области с div вне этой карты. При клике на область все ненужные дивы - скрываются, а див, описывающий эту область - становится видимым. Т.к. на карте будет много областей не хочу писать функцию для каждого клика.
<p>
<img src="plan.png" alt="plan" class="map" usemap="#features">
<map name="features" id="Navigation">
<area id="wh1" class="hdarea" shape="poly" coords="746,226,944,226,944,373,745,372" href="#" alt="Информация">
<area id="wh2" class="hdarea" shape="poly" coords="745,323,746,373,587,373,586,326" href="#" alt="Информация">
<area id="wh3" class="hdarea" shape="poly" coords="488,271,489,320,386,319,387,270" href="#" alt="Информация">
<area id="wh4" class="hdarea" shape="poly" coords="489,322,489,373,386,371,386,320" href="#" alt="Информация">
</map>
</p>
<div id="wh1d" class="hdtext"> TEXT1 </div>
<div id="wh2d" class="hdtext"> TEXT2 </div>
<div id="wh3d" class="hdtext"> TEXT3 </div>
<div id="wh4d" class="hdtext"> TEXT4 </div>
$(".hdarea").click(function () {
$('div[class="hdtext"]').hide('slow');
var newid = $(this).attr("id");
newid = newid + "d";
var nnput = document.getElementById(newid);
nnput.show();});
Не могу понять, где ошибка. Заранее спасибо за помощь!