Question

请您分享工作示例如何：

加载外部SVG文档以及引用它资源（脚本/风格）
从包含在其中的对象标记加载SVG文档主持人文件

使用jQuery SVG插件？我在项目页面上遇到了麻烦：例如

var SVG = $("#wrapper").svg('get');
SVG.load('external.svg', { addTo:true });

抱怨SVG容器未定义。

以下工作，但未加载svg文件中引用的资源：

$("#wrapper").svg({
    onLoad: function(){
        var svg = $("#wrapper").svg('get');
        svg.load('external.svg', {addTo:true});
    },
    settings: {}
}

这些是外部CSS样式表和脚本。链接的图像显示正确：

<!-- not applied -->
<?xml-stylesheet href="styles/common.css" type="text/css"?>
<svg>
  <!-- not loaded -->
  <script xlink:href="scripts/common.js" />
  <!-- o.k. -->
  <image xlink:href="images/test.png" />
</svg>

Answer 1

这个脚本似乎对我有用：

    function drawIntro(svg) { 

    svg.load('lion.svg', {addTo: true, changeSize: true});

}
$().ready(function(){
$('#svgphone').svg({onLoad: drawIntro});

}); //$().ready(function()

Answer 2

尝试使用我的jQuery hack Create and access SVG tag with jQuery?

或$("#svgphone").css({'background-image': "url(external.svg)"});

使用jQuery SVG插件加载外部SVG文档

2 个答案: