Question

关于html前段select标签的问题！求大神

<select id="trans-language">
<option value ="volvo">Volvo</option>
<option value ="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>

选项的选择列表，
我想把他改成 按钮形式的
大概就是这种形式的

给我弄出来这种按钮然后效果一样就可以了，不需要美观！
求大神代码！！





Answer 1

这种的不要使用select标签了。

使用一个<input type="hidden" id="trans-language" name="trans-language" value="">来接收值。

然后写5个button按钮。用click事件来控制按钮的样式和trans-language的值，这是最有效的方法。

你自己去写个按钮的css

比如：未按下去的按钮样式叫.btn，后面跟一个.me就是粉色背景白字的，这个2个按钮形态你自己写。我给你JS最简便有效的写法。

等于普通按钮class="btn"，按下去的class="btn me"

$(document).ready(function(){
    $(".btn").click(function(){
        $(".btn").removeClass("me");
        $(this).addClass("me");//这俩句控制样式
        $("#trans-language").val($(this).val());//这句把对应的button的值传给之前那个id为trans-language的input标签，用来储存你所选择的值。
    });
});

Answer 2

onchange时事件