4

このコードは Firefox ではうまく機能しますが、IE では機能しません。SVGWeb のドキュメント ( http://svgweb.googlecode.com/svn/trunk/docs/UserManual.html ) を読みましたが、解決策が見つかりません/理解できません。

window.onsvgload = function() {
  carga();
var mySVG = document.getElementById("mySVGObject").contentDocument;
        mySVG.addEventListener('click', function(evt) {
                alert(evt.target.id);
    }, false);
}

私は問題なくIEでこのようなものを使用しています:

mySVG.getElementById('Color2').style.fill='#00cc00'

そのコードを使用すると、形状の色とテキストを変更できますが、リスナーを IE で動作させることはできません。

編集: これは Chrome、Firefox、IE9 で動作します。IE7 で動作する必要があります。これは、SVG オブジェクトをロードする方法です。

 <div style="text-align:center" id="mapaSvg" >
<!--[if !IE]>-->
 <object data="ca.svg" type="image/svg+xml"
      width="700" height="800" id="mySVGObject" > <!--<![endif]-->
<!--[if lt IE 9]>
<object src="ca.svg" classid="image/svg+xml"
      width="700" height="800" id="mySVGObject" > <![endif]-->
<!--[if gte IE 9]>
<object data="ca.svg" type="image/svg+xml"
      width="700" height="800" id="mySVGObject" > <![endif]-->
</object>
</div>
<div style="text-align:center">

IE 開発ツールに次のエラーが表示されます。

「onload の起動中にエラーが発生しました: サポートされていません」

行上：

mySVG.addEventListener('click', function(evt) {
                alert(evt.target.id);
    }, false);

ここでは、IE、Firefox、Chrome で動作する SVGWEB の例を動的な線の上にマウスを置いて確認できます: https://www.destatis.de/bevoelkerungspyramide/

4

2 に答える 2

1

addEventListener代わりに、このブロック内で呼び出してみてくださいonsvgload:

window.addEventListener('SVGLoad', function() {
   // all SVG loaded and rendered
}, false)

これらの構造は同じですが、「onload の起動中にエラーが発生しました: サポートされていません」というエラーのため、この仮定を立てています。

于 2013-03-13T08:37:43.843 に答える
0

それが役立つかどうかはわかりませんが、IE8とIE7を除くすべてのブラウザーで動作することでほぼ同じ問題が発生しました。この問題は、svg<image/>ではなく自己閉鎖型の画像要素を使用したことが原因で発生しました。<image></image>

于 2013-03-12T22:52:47.403 に答える