2 
<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1    /DTD/svg11-flat-20030114.dtd">
<svg width="640" height="480" version="1.1" xmlns="http://www.w3.org/2000/svg"   xmlns:xlink="http://www.w3.org/1999/xlink">
<defs >
<symbol overflow="visible" id="rect1">
<rect x="142" y="67" width="81" height="67" fill="#003399" stroke="none" stroke-    opacity="0" xmlns="http://www.w3.org/2000/svg" />
</symbol>
</defs>
<defs >
<symbol overflow="visible" id="rect2">
<rect x="142" y="67" width="81" height="607" fill="#003399" stroke="none" stroke-    opacity="0" xmlns="http://www.w3.org/2000/svg" />
</symbol>
</defs>

<use xlink:href="#rect1" xmlns:xlink="http://www.w3.org/1999/xlink"    xmlns="http://www.w3.org/2000/svg">
<animateTransform attributeName="transform" begin="0" dur="0.5" fill="freeze" additive="sum" from="-65 7" to="0 0" type="translate" />
<animateTransform attributeName="transform" begin="0.5" dur="0" fill="freeze" additive="sum" from="21 2" to="21 2" type="translate"  />
</use>
<circle id="circle" cx="284.5" cy="142.5" r="56.5" fill="#000000" stroke="none" stroke-opacity="0" transform="matrix(1,0,0,1,-1,-34)" xmlns="http://www.w3.org/2000/svg" />
</svg>

これは私の svg のコードです。これはサンプルです。href id を変更したいです。

<use xlink:href="#rect1"

現在のオブジェクトをひよこするときはいつでも

IDを次のように置き換える場合

<use xlink:href="#rect2"

別の四角形が表示されます。ブラウザで実行時に実行したいので、クリックすると参照時にオブジェクトIDを変更します

誰でも私を助けることができます

4

1 に答える 1

1

これが簡単な答えです（27/05/13更新： <script> タグを追加）

<use id="myImage_ID" xlink:href="#rect1" onclick="myFunc()" .... >

<script> <![CDATA[
  function myFunc() {
    var svgImg = document.getElementById('myImage_ID')
    svgImg.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href" , '#rect2')
  }
]]> </script>
于 2013-05-26T06:56:12.943 に答える