使用javaScript从单选按钮获取值

我试图使用Javascript将值从单选按钮传递到下一个HTML页面。然而，我想出来的Javascript似乎无法访问单选按钮。为什么？使用javaScript从单选按钮获取值

HTML代码：

<body> 
<div id="frontContent"> 

     <p id ="levelContent">Levels: </p> 
     <form id="levelSelection"> 
      <input type="radio" name="level" value="1" >Level 1</input> 
      <input type="radio" name="level" value="2">Level 2</input> 
     </form> 

      <p id="startButton"><a href="index.html">Start</a></p> 

     <p id ="scoreBoard">Highest Score: <span id="score">0</span></p> 

</div> 
</body>

Javascript代码：

var radios = document.getElementsByName('level'); 
     alert(radios.length); 
for (var i = 0, length = radios.length; i < length; i++) { 
    if (radios[i].checked) { 
     alert(radios[i].value); 
     break; 
    } 
}

来源

2015-06-16 ddd suman

你什么时候触发这段代码？在活动内部？ – putvande

下一个html页面？你想分享数据从一个页面到其他？ – vinayakj

是的，我想分享数据到其他页面，但我的问题是我无法访问同一页上的单选按钮。 –

这代码可能会有所帮助：

<!DOCTYPE html> 
<html> 
<body> 
<div id="frontContent"> 

     <p id ="levelContent">Levels: </p> 
     <form id="levelSelection"> 
      <input type="radio" name="level" value="1" >Level 1</input> 
      <input type="radio" name="level" value="2">Level 2</input> 
     </form> 

      <p id="startButton"><a href="index.html">Start</a></p> 
<input type="button" onclick="clickButton()" value="clickMe"/> 
     <p id ="scoreBoard">Highest Score: <span id="score">0</span></p> 

</div> 
<script> 
var radios = document.getElementsByName('level'); 
     alert(radios.length); 
function clickButton(){ 
var radioVal = 0; 
for (var i = 0, length = radios.length; i < length; i++) { 
    if (radios[i].checked) { 
     alert(radios[i].value); 
     radioVal = radios[i].value; 
     break; 
    } 
} 
window.location.href= "index.html?radioValue="+radioVal; 
} 
</script> 
</body> 
</html>

来源

2015-06-16 16:35:37

必须说我正在点击一个按钮进行导航，但同样可能会被模拟为点击链接。在index.html页面上，您可以从URL参数中检索单选按钮的值。 –

-1

请务必将你的JavaScript在文件的结尾，就像这样：

<body> 
    <div id="frontContent"> 

     <p id ="levelContent">Levels: </p> 
     <form id="levelSelection"> 
      <input type="radio" name="level" value="1" >Level 1</input> 
      <input type="radio" name="level" value="2">Level 2</input> 
     </form> 

      <p id="startButton"><a href="index.html">Start</a></p> 

     <p id ="scoreBoard">Highest Score: <span id="score">0</span></p> 

    </div> 

    <script> 

    var radios = document.getElementsByName('level'); 
    alert(radios.length); 
    for (var i = 0, length = radios.length; i < length; i++) { 
     if (radios[i].checked) { 
     alert(radios[i].value); 
     break; 
     } 
    } 
    </script> 
</body>

来源

2015-06-16 16:23:39

这似乎有点毫无意义，因为你永远不会去'收音机[i] .checked'部分。 – putvande

-1

最初没有一个收音机选项被选中。因此，代码不进入，如果块

http://jsfiddle.net/sez8c3xL/检查小提琴为例

<div id="frontContent"> 

     <p id ="levelContent">Levels: </p> 
     <form id="levelSelection"> 
      <input type="radio" name="level" value="1" >Level 1</input> 
      <input type="radio" name="level" value="2" checked='true'>Level 2</input> 
     </form> 

      <p id="startButton"><a href="index.html">Start</a></p> 

     <p id ="scoreBoard">Highest Score: <span id="score">0</span></p> 

</div> 

<script> 

    var radios = document.getElementsByName('level'); 
     alert(radios.length); 
for (var i = 0, length = radios.length; i < length; i++) { 
    if (radios[i].checked) { 
     alert(radios[i].value); 
     break; 
    } 
} 

</script>

来源

2015-06-16 16:26:48

这似乎也毫无意义，因为用户不能选择任何东西。 – putvande

-1

你好这里是工作的脚本来获取单选按钮的价值观：

<script> 
    var elem = document.getElementById('levelSelection').elements; 
    for(var i = 0; i < elem.length; i++) 
    { 
     if(elem[i].type =="radio" && elem[i].checked == true) 
     { 
      alert(elem[i].value); 
     } 
    } 
    </script>

来源

2015-06-16 16:33:59 Luca

<div id="frontContent"> 

     <p id ="levelContent">Levels: </p> 
     <form id="levelSelection"> 
      <input type="radio" onclick="checkRadio()" name="level" value="1" >Level 1</input> 
      <input type="radio" onclick="checkRadio()" name="level" value="2" checked='true'>Level 2</input> 
     </form> 

      <p id="startButton"><a href="index.html">Start</a></p> 

     <p id ="scoreBoard">Highest Score: <span id="score">0</span></p> 

</div> 

<script> 
    function checkRadio(){ 
     var radios = document.getElementsByName('level'); 
     alert(radios.length); 
     for (var i = 0, length = radios.length; i < length; i++) { 
      if (radios[i].checked) { 
      alert(radios[i].value); 
      callRedirect(radios[i].value); 
      break; 
     } 
     } 

    } 

function callRedirect(selectedVal){ 
    window.location.href = "urlHTMLPageURL?radioOption="+selectedVal; 
}  
</script>

来源

2015-06-16 16:36:45 Swaprks

如果你想在页面加载，然后只需调用checkRadio（），它会完成剩下的工作。 – Swaprks

如果要发送到其他页面，则必须将<form>标记设置为action和method，例如：method="get" action="index.html"，并使用提交按钮而不是链接。

因此，在其他页面中，您可以从查询字符串中获取值。

来源

2015-06-16 16:39:50

使用javaScript从单选按钮获取值

回答

相关问题