的JavaScript/SVG

我想在JavaScript的4個按鈕點擊它們的JavaScript/SVG

當到目前爲止改變正方形的顏色在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

你有什麼問題..？ – 2012-04-10 09:12:46

@DavidThomas我可以得到svg正方形顯示出來，但是我無法得到窗體中的按鈕來顯示和工作 – Len 2012-04-10 09:19:22

我不認爲'svg'裏面有'form'和'script'元素。放置在外面。還剩下你的標記是搞砸了（html中沒有body和head元素，xml頭和doctype？這些都是錯誤的）查看HTML文檔的基本結構。 – 2012-04-10 09:30:00

的原因，您的按鈕功能不工作很可能是由於拼寫錯誤造成的。在你的函數中，你指的是一個id爲「mySqaure」的元素，但你的元素的id實際上是「mySquare」。

我不確定爲什麼按鈕沒有出現，因爲標籤看起來是格式良好的，但在g標籤之前似乎有一個「`」字符（不確定這是否在您複製代碼進入這個頁面）。

編輯：您的第一個SVG標記沒有正確關閉（最後沒有/>）。

來源

2012-04-10 09:28:29

拼寫錯誤！ – 2012-04-10 09:29:05

回答

相關問題