我有3个选择框。每个选择框值必须动态更改。
我想根据第一个选择框更改第二个和第三个选择框值。 用jQuery简单方法修复。
Commerce->English
Arts->Gujarati
science->French
Commerce->IP
Arts->Computer
Science->java
请在此处查看html http://jsfiddle.net/j2pCJ/1/
这是示例2框,我想要3个框http://jsfiddle.net/sabithpocker/fRuhn/
JQUERY CODE就在这里
$("#select1").change(function() {
if($(this).data('options') == undefined){
/*Taking an array of all options-2 and kind of embedding it on the select1*/
$(this).data('options',$('#select2 option').clone());
}
var id = $(this).val();
var options = $(this).data('options').filter('[value=' + id + ']');
$('#select2').html(options);
});
答案 0 :(得分:1)
我无法相信你想要的东西很简单:
var secondSelect = $("select[name='2ndbox']");
var thirdSelect = $("select[name='3rdbox']");
var secondOptions = secondSelect.children('option');
var thirdOptions = thirdSelect.children('option');
$("select[name='1stbox']").change(function(){
var selectedIndex = this.selectedIndex;
secondOptions.filter(function(i){ return i == selectedIndex})
.appendTo(secondSelect.empty());
thirdOptions.filter(function(i){ return i == selectedIndex})
.appendTo(thirdSelect.empty());
}).change();
请注意,使用filter
只是实现它的一般方法,在您的具体情况下,我们可以像这样使用.eq()
方法:
secondOptions.eq(selectedIndex).appendTo(secondSelect.empty());