2

我正在尝试在 Internet Explorer 9 上将 jQuery 与内联 SVG 一起使用。这是非常基本的东西，但我似乎无法让它工作。我想做的就是当我点击一个矩形时使用 jQuery 来“提醒”。下面是我尝试过的代码：

<svg xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink">

<script type="text/ecmascript" xlink:href="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" />
<script type="text/ecmascript"><![CDATA[
    $(document).ready(function(){
        $("#bot").click(function (){
            alert("clicked");
        });
    });
]]></script>

<rect x="10" y="10" height="300" width="300" style="fill: #000000" id="bot" />

</svg>

<!--
<script type="text/javascript" href="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" />
<script type="text/javascript"><![CDATA[
$(document).ready(function(){
    $("#bot").click(function (){
        alert("clicked");
    });
});
]]></script>
-->

我可以在矩形上随意单击，但没有任何反应。有谁知道为什么以及如何在 Internet Explorer 9 中修复它（在 Firefox 中运行良好），只使用普通的 jQuery 而没有其他库？

如您所见，我尝试将 JS 部分放在 SVG 标记的内部和外部，看看是否有任何效果。它没有！

4

1 回答 1

1

而不是<script/>，使用<script></script>.

工作示例（在 IE9 和 Chrome 23 中测试）：

http://jsfiddle.net/LrKbS/6/

根据 SVG 规范，使用<script/>是正确的，但是 HTML5 规范中有一个错误（最近修复），涉及外部内容处理和脚本结束标记处理。

于 2012-12-27T23:10:15.343 回答