首页 文章

如何在html中为无线电组列表命名无线电?

提问于
浏览
0

我希望它会发出一份颜色列表 . 在html中,如果输入是列表,它们应该是同名,但是同名的无线电输入,它们将在同一组中,那么如何分隔每个无线电组,但是所有组仍然具有相同的名称,那么我可以使用循环去获取服务器端列表的所有值?

此外,在客户端,我需要检查是否每个组都被选中,所以如何使用javascript或jquery来选择所有的无线电组,而不是所有的单选按钮 .

<form method="post">
Car A: <input type="radio" name="color[]"/>red <input type="radio" name="color[]"/>yello
Car B: <input type="radio" name="color[]"/>red <input type="radio" name="color[]"/>yello
Car C: <input type="radio" name="color[]"/>red <input type="radio" name="color[]"/>yello
<input type="submit"/> </form>

2 回答

  • 5

    组中的每个成员必须具有相同的名称 . 每个组必须具有不同的名称 .

    如果你想要迎合PHP的命名约定以在循环中呈现数据,那么使用一个约定:例如: group[0] 用于第一组,然后 group[1] 用于第二组,依此类推 . 这为您提供了客户端上的唯一名称,而PHP将它们合并到一个数组中 .

    在客户端,您可以执行以下操作:

    var i = 0, myform = /* something */;
    while (myform.elements['group[' + i + ']']) {
        var group = myform.elements['group[' + i + ']'];
        /* Loop over HTML Element Collection to make sure one item is `checked`. */
    }
    
  • 1

    每个组的所有单选按钮都应该有不同的名称 .

    Car A: 
    <input type="radio" name="color1"/>red 
    <input type="radio" name="color1"/>yello
    Car B: <input type="radio" name="color2"/>red <input type="radio" name="color2"/>yello
    Car C: <input type="radio" name="color3"/>red <input type="radio" name="color3"/>yello

    检查是否已选择所有组:

    if ($('input[type="radio"]:checked').length == 3)
        validAction();
    else
        invalidAction();
    

    您可以将选择器仅限制为 name 属性以 color 开头的元素:

    if ($('input[type="radio"][name^="color"]:checked').length == 3)
    

相关问题