Javascript获取所选单选按钮值

我的任务是编写一些javascript代码，将比萨饼添加到“篮子”中。我有一个“添加到篮子”按钮，需要获取比萨饼的名称、描述、大小和价格

目前，我已经设法从“添加到篮子”按钮获取比萨饼的名称和描述，但我还需要获取比萨饼的价格和大小，这取决于用户选择的单选按钮

html代码是给我的

<td>   
    <table border="0" cellpadding="0">
        <tbody>
            <tr align="center">
                <td>
                    <input id="size" name="Cheese" data-price="6.50" value="Small" type="radio" checked>Small
                </td>
                <td>
                    <input id="size" name="Cheese" data-price="8.50" value="Medium" type="radio">Medium
                </td>
                <td>
                    <input id="size" name="Cheese" data-price="9.99" value="Large" type="radio">Large
                </td>
            </tr>
            <tr align="center">
                <td style="padding-top: 6px">£6.50</td>
                <td style="padding-top: 6px">£8.50</td>
                <td style="padding-top: 6px">£9.99</td>
            </tr>
        </tbody>
    </table> 
</td>
<td>
    <input id="addbasket" name="Cheese" data-description="Mozzarella cheese" value="Add to Basket" type="button" onclick="addBasket(this)"> 
</td>

---

现在我不知道如何从单选按钮获取“数据价格”和“值”（比萨饼的大小）。

您可以使用

radio.getAttribute（“数据价格”）

获取比萨饼的价格，使用

radio.value

获取比萨饼的大小。还请注意，通过在节点列表上使用

[].filter.call

，可以避免使用

[].slice.call

var name='Cheese'
功能添加篮（按钮）{
var节点=document.getElementsByName（button.name）
var radio=[].filter.call（节点，函数（e）{
返回e.checked
})[0]
var pizzaname=button.name
var pizzadesc=button.getAttribute（'data-description'）
var pizzasize=radio.value
var pizzaprice=radio.getAttribute（'data-price'））
console.log({
名称：pizzaname，
描述：pizzadesc，
大小：披萨大小，
价格：比萨饼价格
})
}

小的
中等
大的
£6.50
£8.50
£9.99

pizzasize变量出现错误“UncaughtTypeError:无法读取未定义的addBasket属性'value'。pizzaprice变量也出现错误，“UncaughtTypeError:无法读取addBasket处未定义的属性'getAttribute'。我一直在做的一个测试是使用alert（pizzaprice），如果选中了small单选按钮，则它是否会显示“6.50”，但它显示为“未定义”或不会显示警报。您是否尝试运行我上面发布的代码段（在我的计算机上运行）然后将代码与您的代码进行比较？我已经再次进行了测试，并按预期工作，谢谢。我已经包括了更多的比萨饼，但是每个比萨饼都有单独的“添加到篮子”按钮，并且为其onclick调用了相同的“添加篮子”功能。当按下这些按钮时，它们都会给我第一个比萨饼的值。关于如何获取与单击的按钮对应的比萨饼值，有什么想法吗？名称和说明与预期一样有效，但价格和大小是从列表中的第一个比萨饼中选择的值。您需要为输入单选按钮设置与添加到篮子按钮相同的名称，并且每个比萨饼名称不同（例如，

name=“Pepperoni”

您当前看到的奶酪名称）.很乐意帮忙！祝你的项目顺利完成。

function addBasket(button) {
    var nodes = [].slice.call(document.getElementsByName(name));
    var radio = nodes.filter(function(el){return el.checked;})[0];

    var pizzaname = button.name;
    var pizzadesc = button.getAttribute('data-description');

    var pizzaprice = radio.dataset.price;
}