适用于所有'选择选项'问题

我试图将选定的选项应用于其他下拉菜单，但遇到了应用于所有值的问题。适用于所有'选择选项'问题

HTML：

<!-- Default drop --> 
<select class="fldSizeSelect" id="" name=""> 
    <option value="option one">-</option> 
    <option value="option two">S</option> 
    <option value="option three">M</option> 
    <option value="option four">L</option> 
    <option value="option five">XL</option> 
</select> 
<select class="fldSize" id="" name=""> 
    <option value="">-</option> 
    <option value="s">S</option> 
    <option value="m" selected="selected">M</option> 
    <option value="l">L</option> 
    <option value="xl">XL</option> 
</select> 
<select class="fldSize" id="" name=""> 
    <option value="">-</option> 
    <option value="s">S</option> 
    <option value="m" selected="selected">M</option> 
    <option value="l">L</option> 
    <option value="xl">XL</option> 
</select> 
<input type="button" value="Apply to all" class="selectedToAll" id="" name="">

的Jquery：

$('.selectedToAll').click(function() { 
    var position = $('.fldSizeSelect option:selected').index();   
    $('.fldSize option').eq(position).attr('selected', 'selected'); 
});

目前如果我从顶部下拉选择下来，然后单击选择所有它只适用的价值，第一个下拉带班'fldSize'。我尝试使用每个（），但没有运气。

我最初得到的价值和适用于所有，但这是由于第一个选项被覆盖，以及默认值导致的问题（所以如果'M'被选中并适用于所有输出为下面的下拉变成 - M，S，M，L，XL）。

使用当前方法正确的选项适用，但只适用于第一次下拉不全。任何帮助表示赞赏。

来源

2012-07-09 Andross

-1

$('.selectedToAll').click(function() { 
    var position = $('.fldSizeSelectoption:selected').index();  
    $('.fldSize option').eq(position).attr('selected', 'selected'); 
});

您必须在.fldSize和option之间放置一个空格。

来源

2012-07-09 08:27:09 Sllix

我想这是一个错字，原因它的编辑现在:) – Sllix 2012-07-09 08:28:20

雅对不起是一个错字，感谢虽然发现:) – Andross 2012-07-09 08:36:23

为了适用于所有.fldSize选择字段，你应该使用each：

$('.selectedToAll').click(function() { 
    var position = $('.fldSizeSelect option:selected').index(); 
    $('.fldSize').each(function() { 
     $(this).children().eq(position).attr('selected', 'selected'); 
    }); 
});

DEMO：http://jsfiddle.net/g46P6/

来源

2012-07-09 08:27:40 VisioN

啊！非常感谢VisioN :)非常棒。 – Andross 2012-07-09 08:33:12

@Andross欢迎您！在你的情况下，它发生是因为你将'each'应用于'option'元素而不是'select'元素。 – VisioN 2012-07-09 08:34:31

为什么你不能使用值？更改HTML中的第一部分：

<select class="fldSizeSelect" id="" name=""> 
    <option value="">-</option> 
    <option value="s">S</option> 
    <option value="m">M</option> 
    <option value="l">L</option> 
    <option value="xl">XL</option> 
</select>

，然后做到这一点：

$('.selectedToAll').click(function() { 
    var value = $('.fldSizeSelect').val(); 
    $('.fldSize').val(value); 
});

来源

2012-07-09 08:31:29 tb11

试试这个：

$('.selectedToAll').click(function() { 
    var position = $('.fldSizeSelect option:selected').index();   
    $('.fldSize:eq(0) option').eq(position).prop('selected', true); 
    $('.fldSize:eq(1) option').eq(position).prop('selected', true); 
});

http://jsfiddle.net/JkfcB/

来源

2012-07-09 08:36:20 undefined

适用于所有'选择选项'问题

回答

相关问题