使用表单发送自定义数据

【问题标题】：Sending custom data with forms使用表单发送自定义数据
【发布时间】：2013-12-28 18:43:02
【问题描述】：

我在 HTML 表单中有一些类似收音机的控件，如下所示：

一次只能按下其中一个按钮，但它们只是由 jQuery 控制的<div>s。

如何发送与表单数据一起按下的按钮的名称？例如，type=tiny。

我假设我会使用 jQuery，但是使用 JavaScript 做这件事有什么陷阱吗？我需要挂钩表单提交事件吗？谢谢。

【问题讨论】：

为什么它们没有样式单选按钮？
@epascarello 我没有意识到那是一回事。我会调查的。
@epascarello 我真的不知道为什么我以前没有考虑过这个。请将您的评论作为答案，我会将其标记为已解决。

标签： javascript jquery html forms controls

【解决方案1】：

您可以将单选按钮变成按钮，这是一个快速的想法

HTML：

<div class="buttons">
    <input type="radio" name="rb" id="rb1" value="1"/><label for="rb1">One</label>
    <input type="radio" name="rb" id="rb2" value="2" /><label for="rb2">Two</label>
    <input type="radio" name="rb" id="rb3"  value="3"/><label for="rb3">Three</label>
</div>

CSS：

.buttons input {
    display:none;
}

.buttons input + label{
    cursor: pointer;
    width: 2em;
    padding: .3em;
    border: 1px solid black;
    color: #000;
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
}

.buttons input:checked + label{
    background-color: red;
}

.buttons input + label:hover{
  color: #222;
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.3);
}

示例：

http://jsfiddle.net/Mmsf2/

【讨论】：