关于图片上的的链接的问题，熟悉的进来看一下，在线等，谢谢

<map name="Map" id="Map"><area shape="rect" id="a0"  coords="528,612,608,642"  style="cursor:help" href="#temp" />
<area shape="rect" id="a1"  coords="680,645,760,675"  style="cursor:help" href="#temp" />
<area shape="rect" id="a2"  coords="522,484,602,514"  style="cursor:help" href="#temp" />
<area shape="rect" id="a3"  coords="715,585,795,615"  style="cursor:help" href="#temp" />
<area shape="rect" id="a4"  coords="653,515,733,545"  style="cursor:help" href="#temp" />
<area shape="rect" id="a5"  coords="689,489,769,519"  style="cursor:help" href="#temp" />
<area shape="rect" id="a6"  coords="303,675,383,705"  style="cursor:help" href="#temp" />
<area shape="rect" id="a7"  coords="438,543,518,573"  style="cursor:help" href="#temp" />
<area shape="rect" id="a8"  coords="368,520,448,550"  style="cursor:help" href="#temp" />
<area shape="rect" id="a9"  coords="385,665,465,695"  style="cursor:help" href="#temp" />
<area shape="rect" id="a10"  coords="350,783,430,813"  style="cursor:help" href="#temp" /></map>
我想让a0至a5在触发一个事件时生效我想让a6至a10在触发另一个事件时生效不触发事件不生效该怎么办好

解决方案 »

  1.   

    开始时设置成这样
    <map name="Map" id="Map">
    </map>1.触发事件时动态生成Dom ao-a5添加到Map中2.触发另一事件时动态生成Dom a6-a10添加到Map中
      

  2.   

    可以先设置它们的显示为隐藏。
    当A事件为以下：
     function a()
    {
      for(var i=0;i<6;i++)  
      document.getElementById("id"+i).style.visilibity="";
    }
    事件B同理
    试下。
      

  3.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>热点操作</title>
    <script type="text/javascript">
    function $(sId){
    return document.getElementById(sId);
    }function enableArea1(){
    var oMap=$("Map");
    var oArea=document.createElement("area");

    oArea.setAttribute("shape","rect");
    oArea.setAttribute("coords","160,33,288,83");
    oArea.setAttribute("href","javascript:alert(1);");

    oMap.appendChild(oArea);
    }function enableArea2(){
    var oMap=$("Map");
    var oArea=document.createElement("area");

    oArea.setAttribute("shape","circle");
    oArea.setAttribute("coords","196,172,53");
    oArea.setAttribute("href","javascript:alert(2);");

    oMap.appendChild(oArea);
    }
    </script>
    </head>
    <body>
    <input type="button" value="启用热点1" onclick="enableArea1();"/>
    <input type="button" value="启用热点1" onclick="enableArea2();"/>
    <br/>
    <img src="http://www.gojx.com/xin/UploadPic/2005-12/20051215114157364.JPG" border="0" usemap="#Map"/>
    <map name="Map" id="Map">
    </map>
    </body>
    </html>
      

  4.   

    谢谢再一个问题在应用enableArea2后，怎样把enableArea1的链接销毁一会结分给您
      

  5.   

    在enableArea1 enableArea2中都先删除DOM
      

  6.   

    借用4L代码
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>热点操作</title>
    <script type="text/javascript">
    function $(sId){
        return document.getElementById(sId);
    }function enableArea1(){
        var oMap=$("Map");
        var oArea=document.createElement("area");
        
        oArea.setAttribute("shape","rect");
        oArea.setAttribute("coords","160,33,288,83");
        oArea.setAttribute("href","javascript:alert(1);");
        
        oMap.appendChild(oArea);
    }function enableArea2(){
        var oMap=$("Map");
        for(var i=oMap.childNodes.length-1;i>=0;i--) oMap.removeChild(oMap.childNodes[i]);//删除所有热点
        var oArea=document.createElement("area");
        
        oArea.setAttribute("shape","circle");
        oArea.setAttribute("coords","196,172,53");
        oArea.setAttribute("href","javascript:alert(2);");
        
        oMap.appendChild(oArea);
    }
    </script>
    </head>
    <body>
    <input type="button" value="启用热点1" onclick="enableArea1();"/>
    <input type="button" value="启用热点1" onclick="enableArea2();"/>
    <br/>
    <img src="http://www.gojx.com/xin/UploadPic/2005-12/20051215114157364.JPG" border="0" usemap="#Map"/>
    <map name="Map" id="Map">
    </map>
    </body>
    </html>
      

  7.   

    本想让楼主自己完成剩下的那一点功能的。见大家后回复了也回一个吧。请空就不用那么麻烦了
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>热点操作</title>
    <script type="text/javascript">
    function $(sId){
    return document.getElementById(sId);
    }function enableArea1(){
    var oMap=$("Map");
    var oArea=document.createElement("area");

    oMap.innerHTML="";

    oArea.setAttribute("shape","rect");
    oArea.setAttribute("coords","160,33,288,83");
    oArea.setAttribute("href","javascript:alert(1);");

    oMap.appendChild(oArea);
    }function enableArea2(){
    var oMap=$("Map");
    var oArea=document.createElement("area");

    oMap.innerHTML="";

    oArea.setAttribute("shape","circle");
    oArea.setAttribute("coords","196,172,53");
    oArea.setAttribute("href","javascript:alert(2);");

    oMap.appendChild(oArea);
    }
    </script>
    </head>
    <body>
    <input type="button" value="启用热点1" onclick="enableArea1();"/>
    <input type="button" value="启用热点2" onclick="enableArea2();"/>
    <br/>
    <img src="http://www.gojx.com/xin/UploadPic/2005-12/20051215114157364.JPG" border="0" usemap="#Map"/>
    <map name="Map" id="Map">
    </map>
    </body>
    </html>
      

  8.   

    非常谢谢两位
    消除链接的方法这样的简单lihui_shine，已经另一贴里给了分，谢谢再次谢谢