我正在使用jQuery。
$('#ranges').on('change', '.combo', function() {
var selectedValue = $(this).val();
var s = $(this).parent("div").attr("class");
if ($(this).find('option').size() > 2) {
var newComboBox = $(this).clone();
var thisComboBoxIndex = parseInt($(this).attr('data-index'), 10);
var newComboBoxIndex = thisComboBoxIndex + 1;
$('div.'+s+' .parentCombo' + thisComboBoxIndex).remove();
if (selectedValue !== '') {
newComboBox.attr('data-index', newComboBoxIndex);
newComboBox.attr('id', 'combo' + newComboBoxIndex);
newComboBox.addClass('parentCombo' + thisComboBoxIndex);
newComboBox.find('option[val="' + selectedValue + '"]').remove();
$('div.'+s).append(newComboBox);
}
});
我怎样才能保证这个价值始终高于下一个?可能会提醒用户注意该问题或将该combobox_text_value变为“红色”或阻止用户提交。
小提琴,例如。如果我在第一个组合中选择2,我应该只在下一个选择3。
ps:请注意我,如果你需要更多代码。
使用值进行动态组合框处理
答案 0 :(得分:0)
参见工作jsfiddle:
$('body').on('change', '.combo', function() {
var selectedValue = $(this).val();
if ($(this).find('option').size() > 2) {
var $newComboBox = $(this).clone();
var thisComboBoxIndex = parseInt($(this).data('index'), 10);
var newComboBoxIndex = thisComboBoxIndex + 1;
$('.parentCombo' + thisComboBoxIndex).remove();
if (selectedValue !== '') {
$newComboBox.data('index', newComboBoxIndex)
.attr('id', 'combo' + newComboBoxIndex)
.addClass('parentCombo' + thisComboBoxIndex)
.find('option')
.filter(function(){return this.value<=selectedValue && this.value}).remove();
if($('option',$newComboBox).size() > 1)
$('body').append($newComboBox);
}
}
});