Question

如果可能的话我想做什么：我在webform（帖子）中有一个带有2个可点击按钮（区域）的图像，用户应点击该区域中的两个按钮，当他们点击提交按钮时服务器端应该可以读取该区域是0还是1！如果点击（1）时可以突出显示/标记图像的点击区域，如果再次点击则可以显示该图像（0）

唯一的想法是使用imagemap和javascript，但欢迎使用其他解决方案！

我有一个两个矩形的imagemap 2，我希望它改变输入字段中的值，第一次它应该是1，然后下一次点击它应该toogle到0，我不知道该怎么做。有人能帮助我吗？

当它应该很棒时，我是否可以突出显示/标记该部分图像！

<form name="form">
<input type='text' name='test1' value='0' />
<input type='text' name='test2' value='0' />
<img src="plansets.gif" width="145" height="126" usemap="#foo">
<map name='foo'>
  <area shape='rect' coords="0,0,82,126" href='javascript:document.form.test1.value=1;' alt="test"/>
  <area shape='rect' coords="82,0,145,186" href='javascript:document.form.test2.value++;' alt="test2"/>
</map>

 </form>

Answer 1

Js fiddle

HTML

<form name="form">
<input type='text' name='test1' value='0' />
<input type='text' name='test2' value='0' />
<img src="plansets.gif" width="145" height="126" usemap="#foo">
<map name='foo'>
  <area shape='rect' coords="0,0,82,126" href='javascript:document.form.test1.value=1;' alt="test"/>
  <area shape='rect' id="test" coords="82,0,145,186" href='#' alt="test2"/>
</map>

 </form>

JS

$("#test").click(function(){
    var $test2 =$("input[name='test2']");
    if($test2.val() == 1){
        $test2.val(0);
    }else{
        $test2.val(1);
    }
});

这是你期望做的吗？使用jquery可以得到你的效果。

图像映射javascript在单击时切换输入字段中的值

1 个答案: