如何使用JavaScript創建一組單選按鈕？

Question

有誰知道為什么這個簡單的程序不起作用？ 這是一個使用Javascript創建一組單選按鈕的程序。

<html>
  <head>
    <script>
      function onWriteRadio(Valuse,numButtons,RadioName){
        for(i=0;i<numButtons;i++){
          document.write("<input type='radio' name=" + RadioName + "value="       +Valuse[i]+"/>");
          document.write("<br/>");
        }
      }
    </script>
  </head>

  <body onload="onWriteRadio([red,green,blue],3,'color')>

  </body>
</html>

Answer 1

用這個：

onWriteRadio(['red','green','blue'],3,'color')

字符串化數組值。 當前，您說[紅色，綠色，藍色]，這意味着變量紅色，變量綠色，變量藍色，但是您沒有在任何地方定義它們，因此您的程序在說“嗯，我不知道紅色是什么”。 ..這樣的字符串。

Answer 2

將數組值放在引號中

onWriteRadio(['red','green','blue'],3,'color')

Answer 3

您留下了一些引號。

 function onWriteRadio(values, radioName){ for (var i = 0; i < values.length; i++) { document.write("<input type='radio' name='" + radioName + "' value='" +values[i]+"' >"+values[i]+" </ input>"); document.write("<br/>"); } }

 <html> <body onload="onWriteRadio(['red', 'green', 'blue'], 'color')"> </body> </html>

Answer 4

document.write()將HTML表達式或JavaScript代碼寫入文檔，以替換您之前的html內容。

頁面加載完成后執行的document.write()將覆蓋頁面或寫入新頁面。

document.write()是一種不良做法

Answer 5

將數組值放在引號中
添加onload的雙引號
創建一個包含所有輸入代碼的字符串，然后編寫

您的代碼應如下所示：

<html>
<head>
<script>
function onWriteRadio(Valuse,numButtons,RadioName){
    var s = '';
    for(i=0;i<numButtons;i++){
        s += "<input type='radio' name=" + RadioName + "value="       +Valuse[i]+"/>"
    }
    document.write(s);
}
</script>
</head>
<body onload="onWriteRadio(['red','green','blue'],3,'color')">
</body>
</html>

如何使用JavaScript創建一組單選按鈕？

問題描述

5 個解決方案

解決方案1
5 2014-01-21 09:27:58

解決方案2
2 2014-01-21 09:28:41

解決方案3
1 2014-01-21 09:44:21

解決方案4
0 2014-01-21 09:27:44

解決方案5
0 2014-01-21 09:30:50

如何使用JavaScript創建一組單選按鈕？

問題描述

5 個解決方案

解決方案1 5 2014-01-21 09:27:58

解決方案2 2 2014-01-21 09:28:41

解決方案3 1 2014-01-21 09:44:21

解決方案4 0 2014-01-21 09:27:44

解決方案5 0 2014-01-21 09:30:50

解決方案1
5 2014-01-21 09:27:58

解決方案2
2 2014-01-21 09:28:41

解決方案3
1 2014-01-21 09:44:21

解決方案4
0 2014-01-21 09:27:44

解決方案5
0 2014-01-21 09:30:50