JSFiddle：将div变成单选按钮

Question

http://jsfiddle.net/3ypYW/

<a href=""><div class="service1"><p>Option 1</p></div></a>

我创建了一个带有悬停功能的简单div，我想将其转换为单选按钮，成为表单的一部分。我非常精通form和div以及CSS和JQuery，但我不知道如果可能的话，我可以将它们绑在一起创建一个单选按钮，在选中时它会显然变绿。

谢谢！

Answer 1

试试这个： 在你的CSS中为已检查的样式添加一个类，它可以与悬停相同。

.service1:hover, .checked { background:#66ff99; color:#000; }

为您的链接添加一个js调用，不要忘记留在页面上的“＃”：

<a href="#" onclick="check(this)">...

最后定义了js函数，它将.checked类添加到div：

<script type="text/javascript">
function check(element) {
    d = element.firstChild;
    d.className = d.className + " checked";
}
</script>