【javaWeb】JS和JQuery判断radio（单选框）是否选中和获取选中值方法总结

最新推荐文章于 2026-04-18 04:36:06 发布

原创最新推荐文章于 2026-04-18 04:36:06 发布 · 2.9k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

javaweb 专栏收录该内容

26 篇文章

订阅专栏

本文介绍了一种使用三级单选按钮进行联动显示隐藏，并通过AJAX向后台传递选中值的方法。涉及JS函数实现按钮联动，及JQuery辅助AJAX数据传输。

情况描述，我就不贴代码了:

当前有3级单选按钮。

一级单选按钮有三个：a\b\c，它们的name都是【n1】。

选一级的b时会出现2级隐藏单选按钮的d\e，它们的name都是【n2】。

选一级的c时会出现2级隐藏按钮的f\g\h\i\j，它们的name都是【n3】。

选J时会出现最后的3级隐藏文本框K，它的name是【n4】。

现在通过AJAX来向后台传递选中的单选框的值，解决方法如下。

JS：

这里的JS主要用来实现按钮的隐藏和出现。

function hidden0() {
        document.getElementById("SSexDiv").style.display = "none";
        document.getElementById("SAgeDiv").style.display = "none";
        document.getElementById("SAgeDiv2").style.display = "none";
    }

function select1() {
        var selectValue;
        for (i = 0; i < selectByRadio.seek1.length; i++) {
            if (selectByRadio.seek1[i].checked == true) {
                selectValue = selectByRadio.seek1[i].value;
            }
        }
        if (selectValue == "SSex") {
            hidden0();
            document.getElementById("SSexDiv").style.display = "block";

        }
        else if (selectValue == "SAge") {
            hidden0();
            document.getElementById("SAgeDiv").style.display = "block";
        }
        else
        {hidden0();}
    }

    window.onload = hidden0();

Jquery：

这里获得是要借助ajax传递给后台的。

var sR_seek1=$('input[name="seek1"]:checked').val();
var sR_seek2=$('input[name="seek2"]:checked').val();
var sR_seek3=$('input[name="seek3"]:checked').val();
var sR_seek3_2=$(document.getElementsByName("seek3_2")).val();