のJavaScript/SVG

これまでのところ、私は次のコードのJavaScript/SVG

<html> 
<?xml version="1.0" encoding="UTF-8" standalone="no"?> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" 
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> 
<svg width="100%"height="100%"version="1.1" 
<svg xmlns="http://www.adobe.com/svg"> 
    <script type="text/ecmascript"> 
    <![CDATA[ 

function chooseColor1() { 

document.getElementsById("mySqaure")[0].style.color = "green"; 


     } 

     function chooseColor2() { 

      document.getElementsById("mySqaure")[0].style.color = "pink"; 

     } 

     function chooseColor3() { 

      document.getElementsById("mySqaure")[0].style.color = "purple"; 

     } 

     function chooseColor4() { 

      document.getElementsById("mySqaure")[0].style.color = "blue"; 

     } 



    ]]> 
</script> 
`<g 
    id="firstGroup"> 
    <rect id = "mySquare" x="0" y="0" width="20" height="20" fill="grey" stroke="black" stroke-width="2" /> 

    </g> 

    <form onsubmit="return false"> 
     <input type="button" value="green" onclick="chooseColor1()"/> 
     <input type="button" value="pink" onclick="chooseColor2()"/> 
     <input type="button" value="purple" onclick="chooseColor3()"/> 
      <input type="button" value="blue" onclick="chooseColor4()"/> 
    </form> 
</svg> 

</html>

出典

2012-04-10 Len

あなたはどんな問題を抱えていますか？ –

@DavidThomas私は表示するsvgの正方形を得ることができますが、私は表示され、働くためにフォームのボタンを取得することができません – Len

私は 'form'と' script'要素が 'svg'の内部で許されているとは思わない。それらを外に置きます。 HTML文書の基本構造を見直してください。HTML文書の基本構造を見直してください。 –

理由あなたのボタンの機能を持っている彼らに

をクリックしたときに、私は、SVGで四角形の色を変更するには、JavaScriptで4つのボタンを取得したいですスペルミスが原因である可能性が高いです。関数では、idが "mySqaure"の要素を参照していますが、要素のIDは実際には "mySquare"です。

タグが整形式であると表示されない理由はわかりませんが、gタグの直前に "` "文字が表示されています（このタグがコピーされたこのページへのコード）。

編集：最初のSVGタグが正しく閉じられていません（最後に/>はありません）。

出典

2012-04-10 09:28:29

ミススペルの教科書の場合！ –

答えて

関連する問題