我将用代码解释我的情况。
HTML:
<div class="list1">
<select class="select250">
<option class="temp" selected="selected" name="filter[]">Select</option>
<option class="" value="George" name="filter[]">George</option>
<option class="" value="Ben" name="filter[]">Ben</option>
</select>
</div>
<div class="list2">
<select class="select251">
<option class="temp" selected="selected" name="filter[]">Select</option>
<option class="" value="Sarah" name="filter[]">Sarah</option>
<option class="" value="Alex" name="filter[]">Alex</option>
<option class="" value="Natalie" name="filter[]">Natalie</option>
</select>
</div>
<div class="list3">
<select class="select252">
<option class="temp" selected="selected" name="filter[]">Select</option>
<option class="" value="Mobile" name="filter[]">Mobile</option>
<option class="" value="Car" name="filter[]">Car</option>
<option class="" value="Computer" name="filter[]">Computer</option>
</select>
</div>
JS(这在PHP中使用):
<script type="text/javascript">
$('.select<?php echo $sid?>').change(function() {
$('.temp', this).remove(); // THIS IS FINE
if ($('option').siblings('.temp')) { }
else { $('select').prepend('<option name="filter[]" selected="selected" class="temp">Select</option>'); // THIS IS NOT WORKING
}
});
</script>
我想要做的是 - 每当选择一个选项时,它应该删除&#34;选择&#34;该列表中的选项但仍然保持&#34;选择&#34;其他清单上的选项。这部分似乎工作正常。接下来要做的是 - 当在另一个列表上选择一个选项时,它应该在所有其他列表上带回选择,除了选择它的那个。我尝试为它编写代码,如上所示,但无法通过它。如果有人可以指导我朝着正确的方向前进,那就太棒了。感谢。
答案 0 :(得分:3)
试试这个..这仍然可以优化..
$('[class^=select]').on('change', function() {
$('.temp', this).remove();
var $that = $(this);
$('select').not($that).each(function() {
if (!$(this).find('option.temp').length > -1) {
$(this).prepend('<option name="filter[]" selected="selected" class="temp">Select</option>');
}
});
});
<强> Check Fiddle 强>
答案 1 :(得分:1)
这样的事情怎么样:
$('select').not($(this)).each(function() {
if ($(this).find('.temp').size() > 0) continue;
$(this).prepend('<option class="temp" ... </option>');
});