是否可以将选择菜单转换为按钮？

我有一个简单的选择菜单，例如

Would you recommend this company?
  Yes No  

我要求用户反馈，它目前通过一个简单的表单提交function，现在它是2013年我喜欢使它成为2个按钮，例如“Thumbs Up”或“Thumbs Down”（选择时突出显示）/ interchangable（例如can一次选择2）。

到目前为止……但它并没有真正应用选择值或“选定”效果：

http://jsfiddle.net/mBUgc/18/

我最接近的是以下…将选择的菜单转换为星级评分… – 但它并不是真正可用的，所以希望有人可以帮助/指向正确的方向或一些代码示例。

http://netboy.pl/demo/jquery-bar-rating/examples/

Answer 1

更新 ：

为所选值的表单提交添加了隐藏元素。

http://jsfiddle.net/mBUgc/21/

---

这是您希望实现的简单实现。

演示 ： http ： //jsfiddle.net/mBUgc/19/

JavaScript ：

 $("select option").unwrap().each(function() { var btn = $('
'+$(this).text()+'
'); if($(this).is(':checked')) btn.addClass('on'); $(this).replaceWith(btn); }); $(document).on('click', '.btn', function() { $('.btn').removeClass('on'); $(this).addClass('on'); }); 

CSS ：

 div.btn { display: inline-block; /** other styles **/ } div.btn.on { background-color: #777; color: white; /** styles as needed for on state **/ } 

注意 ：无论您在选择中使用多少选项，这都将有效 – http://jsfiddle.net/mBUgc/20/