javascript - 使用 CSS/JS/JQuery 自定义单选按钮

Question

我正在开发一个小型网络管理工具，它允许用户查看和编辑数据库对象的属性。大多数设置都是“是/否/不知道”类型的属性。

有很多设置要显示，因此要管理屏幕空间& 可用性很重要。

当我第一次搭建 UI 时，我使用的是上图中的测试 1。 可以说，它看起来很困惑，并且用户界面中的多个列/类别组中有数十个这样的内容。测试 2 稍好一些，但好不了多少。

所以我正在考虑做类似测试 3 的事情。根据 html 中选择的单选按钮，会出现不同的图像。单击图像可重复循环显示 3 个选项。

(如果您曾经使用过 GMail Labs 功能，该功能允许您为您的电子邮件设置许多不同类型的“星形”标志，那就是这个想法)

这是我向 UI/CSS 专家提出的问题。

1. “测试 3”是可接受/可用的解决方案吗？

2. 如果是这样，是否可以仅使用 CSS 和 JS 将单选按钮(或选择/选项)输入更改为该输入？ (或者如果您可以向我指出教程/资源，我将不胜感激)

谢谢

Eoin C

Answer 1

骑自行车的东西对我来说似乎没什么用。我认为测试 2 是最好的选择。 它可能看起来有点“困惑”，但至少它是可用的。如果有人每天需要填写 5 次这些表格，我想他很快就会开始对骑自行车感到厌倦。

另一个重要的一点是:在测试 2 中你没有默认值，这很好。因为有人忘记了 1 行，你可以为此进行表单验证。对于循环的事情，默认值已经成为答案之一，使得输入更容易出错。

如果我是你，我会参加测试 2，并将未知数放在右侧，这样你就有"is"、“否”、“未知”。