Javascript로 생성 된 이미지 맵은 어떤 IE에서도 링크하지 않습니다.

이 정적 버전에서는 모든 브라우저에서 가까운 영역을 클릭하여 http://www.google.com으로 이동할 수 있습니다.Javascript로 생성 된 이미지 맵은 어떤 IE에서도 링크하지 않습니다.

<html> 
    <body> 
    <div id="my_div"> 
     <img usemap="#map" 
      src="http://specialmedia.wnyc.org.s3.amazonaws.com/ads/open.jpg" /> 
     <map name="map" id="map"> 
      <area shape="rect" coords="900,0,1000,20" 
       href="http://www.google.com/" target="" alt="" /> 
     </map> 
    </div> 
    </body> 
</html>

동적 버전은 동일해야하며 IE6, IE7 및 IE8을 제외한 모든 브라우저에 있어야합니다. IE에서는지도가 아무런 효과가 없습니다.

<html> 
    <head> 
    <script type="text/javascript" src="http://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
     google.load("jquery", "1"); 
    </script> 
    </head> 
    <body> 
    <div id="my_div"></div> 
    <script> 
     var img = $("<img/>").attr("usemap", "#map"); 
     img.attr("src", "http://specialmedia.wnyc.org.s3.amazonaws.com/ads/open.jpg"); 
     var map = $("<map/>").attr("name", "map").attr("id", "map"); 
     var area = $("<area/>").attr("shape", "rect"); 
     area.attr("coords", "900,0,1000,20") 
     area.attr("href", "http://www.google.com/").attr("target", "") 
     area.attr("alt", ""); 
     map.append(area); 
     $("#my_div").append(img).append(map); 
    </script> 
    </body> 
</html>

IE에서 Javascript로 생성 된 이미지 맵을 만드는 방법이 있습니까? 나는 $(document.ready(...을 이미 시도했다.

출처

2010-01-11 Dave Aaron Smith

map 요소

내가 잘못 될 수도에 추가 할 area을 방지 JQuery와 버그 (1.4에서 해결되어야한다)이있다

하지만, HTML 태그가 먼저 div 내부에 생성됩니다 추가되는 때문입니다 요소를 포함하고 IE는 div에있는 area 태그를 유효한 것으로 인식하지 않으므로 무시됩니다.

가장 좋은 해결 방법은 출시 될 JQuery와 1.4의 DOM

또는

대기에 area의를 문자열로 전체 map 요소를 생성 한 후 자녀와 함께 전체 map 요소를 추가하는 것입니다 ...

예를 들어

var map=$("<map name='map' id='map'><area coords='900,0,1000,20' href='http://www.google.com/' alt='' /></map>"); 
$("#my_div").append(img).append(map);

출처

2010-01-11 19:38:21 ekhaled

Javascript로 생성 된 이미지 맵은 어떤 IE에서도 링크하지 않습니다.

답변

관련 문제