样式为切换按钮的 HTML 单选按钮

Question

我希望将选项显示为可点击的按钮，而不是让典型的磁盘带有右侧的标签。所选选项应该看起来是被推入或压入的。

我想在 HTML 中执行此操作，但示例是 Audacity 程序的左上角按钮，您可以在其中选择光标/工具模式。

最好的方法是什么？

_{（来源：freemusicsoftware.info）}

Answer 1

有很多 JavaScript 插件可以做到这一点：

• Prototype demo

只需将他们正在使用的图像替换为您的图像，您就可以开始使用了。

Answer 2

可能最好的方法是创建一个真正的单选按钮，然后使用 javascript 根据单选按钮上的状态控制元素的呈现。如果选择了单选按钮，则渲染背景-a，否则渲染背景-b（或使用精灵）。通过自定义元素的点击事件控制单选按钮的状态。

Answer 3

使用this jQuery UI plugin，您可以自定义单选按钮和/或复选框以显示您想要的外观。