我的JS程序有一些奇怪的问题。我有这个工作正常,但由于某种原因,它不再工作。我只是想找到单选按钮的值(其中一个被选中)并将其返回给一个变量。由于某种原因,它总是返回undefined。

这是我的代码:

function findSelection(field) {
    var test = 'document.theForm.' + field;
    var sizes = test;

    alert(sizes);
        for (i=0; i < sizes.length; i++) {
            if (sizes[i].checked==true) {
            alert(sizes[i].value + ' you got a value');     
            return sizes[i].value;
        }
    }
}

submitForm:

function submitForm() {

    var genderS =  findSelection("genderS");
    alert(genderS);
}

HTML:

<form action="#n" name="theForm">

    <label for="gender">Gender: </label>
    <input type="radio" name="genderS" value="1" checked> Male
    <input type="radio" name="genderS" value="0" > Female<br><br>
    <a href="javascript: submitForm()">Search</A>
</form>

当前回答

试试这个

function findSelection(field) {
    var test = document.getElementsByName(field);
    var sizes = test.length;
    alert(sizes);
    for (i=0; i < sizes; i++) {
            if (test[i].checked==true) {
            alert(test[i].value + ' you got a value');     
            return test[i].value;
        }
    }
}


function submitForm() {

    var genderS =  findSelection("genderS");
    alert(genderS);
    return false;
}

这里有一把小提琴。

其他回答

编辑: 正如Chips_100所说,你应该使用:

var sizes = document.theForm[field];

直接不使用测试变量。


旧的回答:

你不应该这样评估吗?

var sizes = eval(test);

我不知道这是如何工作的,但对我来说,你只是复制了一个字符串。

这里有一个很好的方法来获得选中的单选按钮的值与纯JavaScript:

const form = document.forms.demo;
const checked = form.querySelector('input[name=characters]:checked');

// log out the value from the :checked radio
console.log(checked.value);

来源:https://ultimatecourses.com/blog/get-value-checked-radio-buttons

使用这个HTML:

<form name="demo">
  <label>
    Mario
    <input type="radio" value="mario" name="characters" checked>
  </label>
  <label>
    Luigi
    <input type="radio" value="luigi" name="characters">
  </label>
  <label>
    Toad
    <input type="radio" value="toad" name="characters">
  </label>
</form>

你也可以使用Array Find the checked属性来查找被选中的项:

Array.from(form.elements.characters).find(radio => radio.checked);

你可以这样做:

var收音机= document.getElementsByName('性别'); 对于(var I = 0,长度= radio .length;I < length;我+ +){ If(收音机[i].checked) { //做任何你想做的检查收音机 警报(无线电[我]。value); //逻辑上只能检查一个无线电,不要检查其他的 打破; } } <label for="gender">性别:</label> <input type="radio" name=" lads " value="1" checked="checked">Male</input> . <input type="radio" name="gender " value="0">Female</input> .

斯菲德尔

编辑:感谢HATCHA和jsetung的编辑建议。

ECMAScript 6版本

let genderS = Array.from(document.getElementsByName("genderS")).find(r => r.checked).value;

我更喜欢使用formdata对象,因为它表示提交表单时应该发送的值。

注意,它显示了表单值的快照。如果更改值,则需要重新创建FormData对象。如果您想查看收音机的状态变化,您需要订阅更改事件更改事件演示

演示:

let formData = new formData (document.querySelector("form")); console.log('值为:${formData.get("choice")} '); < >形式 比萨皮< p >: < / p > < p > <input type="radio" name="choice" value="regular" > <label for="choice1id">普通外壳</label> < / p > < p > <input type="radio" name="choice" value="deep" checked > <label for="choice2id">深盘</label> < / p > > < /形式