开发者问题收集

如何获取选定单选按钮的值并返回其值

2019-02-06
80
javascript

我之前尝试过其他帖子中的示例，但是都没有用？

这是代码。 

function sumvalnotset(modelbtn) {
    var model;
    for (var i = 0; i < modelbtn.length; i++) {
        if(modelbtn[i].checked) {
            model = modelbtn[i].value;
            break;
        }
    }
    var p = document.getElementById("sumvalnotset");
    p.innerHTML = "the value is " + model
}
<body>
  <div>
    <p>Select:</p>
    <input class="modelbtn" name="genoptradio1" type="radio" value="22,8" onclick="sumvalnotset('genoptradio1')">example1
    <input class="modelbtn" name="genoptradio1" type="radio" value="29,6" onclick="sumvalnotset('genoptradio1')">example2
    <input class="modelbtn" name="genoptradio1" type="radio" value="34,2" onclick="sumvalnotset('genoptradio1')">example3
    <input class="modelbtn" name="genoptradio1" type="radio" value="31,2" onclick="sumvalnotset('genoptradio1')">example4
  </div>
  <p id="sumvalnotset">the value is 0</p>
</body>
3个回答

您可以通过传入 this 来简化它。从事件中您可以获取 defaultValue 或仅获取 value 

function sumvalnotset(e) {
    var model = e.defaultValue;
    var p = document.getElementById("sumvalnotset");
    p.innerHTML = "the value is " + model
}
<body>
  <div>
    <p>Select:</p>
    <input class="modelbtn" name="genoptradio1" type="radio" value="22,8" onclick="sumvalnotset(this)">example1
    <input class="modelbtn" name="genoptradio1" type="radio" value="29,6" onclick="sumvalnotset(this)">example2
    <input class="modelbtn" name="genoptradio1" type="radio" value="34,2" onclick="sumvalnotset(this)">example3
    <input class="modelbtn" name="genoptradio1" type="radio" value="31,2" onclick="sumvalnotset(this)">example4
  </div>
  <p id="sumvalnotset">the value is 0</p>
</body>
StudioTime
2019-02-06

您可以使用以下代码。 

function sumvalnotset(modelbtn) {
  var p = document.getElementById("sumvalnotset");
  p.innerHTML = "the value is " + modelbtn.value
}
<body>
  <div>
    <p>Select:</p>
    <input class="modelbtn" name="genoptradio1" type="radio" value="22,8" onclick="sumvalnotset(this);">example1
    <input class="modelbtn" name="genoptradio1" type="radio" value="29,6" onclick="sumvalnotset(this);">example2
    <input class="modelbtn" name="genoptradio1" type="radio" value="34,2" onclick="sumvalnotset(this);">example3
    <input class="modelbtn" name="genoptradio1" type="radio" value="31,2" onclick="sumvalnotset(this);">example4
  </div>
  <p id="sumvalnotset">the value is 0</p>
</body>
Code_Ninja
2019-02-06

尝试将按钮的值作为 this 传入，然后在函数中按如下方式访问该值： 

function sumvalnotset(modelbtn){
       // here you access the actual value of the clicked radio button
       const value = modelbtn.value;     
       alert(value); 
    }
<body>
        <div>
          <p>Select:</p>
              <input class="modelbtn" name="genoptradio1" type="radio" value="22,8" onclick="sumvalnotset(this);">example1
              <input class="modelbtn" name="genoptradio1" type="radio" value="29,6" onclick="sumvalnotset(this);">example2
              <input class="modelbtn" name="genoptradio1" type="radio" value="34,2" onclick="sumvalnotset(this);">example3
              <input class="modelbtn" name="genoptradio1" type="radio" value="31,2" onclick="sumvalnotset(this);">example4
        </div>
        <p id="sumvalnotset">the value is 0</p>
    </body>
2019-02-06