html:只需选择几个选项即可。
<select id="link">
<option>Small</option>
<option>Medium</option>
<option>Large</option>
<option>XLarge</option>
</select>
jquery:我复制了select,然后将它们转换为radiobuttons。
$(document).ready(function()
{
$('#link').each(function(i, select){
var $select = $(select);
$select.find('option').each(function(j, option){
var $option = $(option);
// Create a radio:
var $radio = $('<input type="radio" name="radios" value="all"/>');
// Set name and value:
$radio.attr('name', $select.attr('name')).attr('value', $option.val());
// Set id
$radio.attr('id', $option.val());
// Set checked if the option was selected
if ($option.attr('selected')) $radio.attr('checked', 'checked');
// Insert radio before select box:
$select.before($radio);
// Insert a label:
$select.before(
$("<label>").attr('for', $option.val()).text($option.text())
);
});
});
});
这是我的jsfiddle:http://jsfiddle.net/T2Cc6/
答案 0 :(得分:2)
也许这会对你有所帮助:
$(':radio').click( function() {
var size = $(this).val();
$("select#link option").filter(function() {
return $(this).val() == size;
}).prop('selected', true);
});
答案 1 :(得分:0)
试试这个, Demo
$("#link").change(function(){
$that = $(this)
$("input[type=radio]").each(function(i, el){
$("label[for='"+this.value+"']").css('background','#fff')
if($that.val()==this.value){
$("label[for='"+this.value+"']").css('background','#e0e0e0')
}
})
})
$("input[type=radio]").click(function(){
$("label").css('background','#fff')
$("label[for='"+this.value+"']").css('background','#e0e0e0')
})