HTML/PHP：基于一个单选选项传递多个值答案

【问题标题】：HTML/PHP: Pass multiple values based on one radio optionHTML/PHP：基于一个单选选项传递多个值
【发布时间】：2014-08-06 18:30:53
【问题描述】：

我有一个简单的收音机选择，我试图将两个值传递到下一页。产品名称和价格。如何将两个信息位分配给同一个电台选项？

我倾向于使用隐藏字段，但我不确定如何将它们链接到各自的电台选项。

【问题讨论】：

标签： javascript php html radio-button

【解决方案1】：

隐藏字段不起作用，但这样做：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Demo Send multiple radio data</title>
    <script>
        function getRadioData(radios) {
            window.radioValue = null;
            window.radioId = null;
            window.radioName = null;
            window.radioClass = null;
            for (var i=0; i<radios.length; i++) {
                var radio = radios[i];
                if (radio.checked) {
                    radioValue = radio.value;
                    radioId = radio.id;
                    radioName = radio.name;
                    // radioClass = radio.className; // no class given yet
                    break;
                }
            }
            return;
        }

        function sendRadioData(groupName) {
            var theGroup = theForm.elements[groupName];
            getRadioData(theGroup);
            // console.log(radioValue,radioId,radioName); 
            if (radioValue == null) {
                alert('No radio checked');
                return false;
            }
            else {
                window.location.href = 'nextpage.php?radioValue='+radioValue+'&radioId='+radioId+'&radioName='+radioName;
            }
        }
    </script>
</head>
<body>
    <form name="theForm" id="theForm" action="nextpage.php">
        <input type="radio" name="yourName" value="10" id="firstId"><br>
        <input type="radio" name="yourName" value="20" id="secondId"><br>
        <input type="radio" name="yourName" value="30" id="thirdId"><br>
        <input type="radio" name="yourName" value="40" id="fourthId"><br>
        <input type="button" value="Send radio data" onclick="sendRadioData('yourName')">
    </form>
</body>
</html>

。

如您所见，您甚至可以在每次单击单选按钮时发送四个易于检索的数据位。只有名称保持不变。只需确保将 nextpage.php 调整为 GET 变量即可。

没有现场演示，因为你只能在控制台或地址栏中看到结果。

【讨论】：