1
再次編輯...我只是一個假人,並想通了!jquery動態選擇不提交值
編輯:因此,它看起來像如果我在目標選擇框突出一切並點擊「添加所選」,將其提交...我如何糾正這種行爲在下面的代碼,這樣你不必須點擊「添加選擇」按鈕才能使其工作?
我有一個包含三個選擇框的表單。第一個是類別,並從中選擇一個類別將填充具有特定於所選類別的值的變量多選框。選擇變量,然後單擊「添加選定」將填充目標選擇框將這些變量。問題是,print_r顯示目標選擇框中的值不會在提交時傳遞,我不明白爲什麼......以下是代碼,並且非常感謝幫助
下面是html標記:
<select multiple="" id="categories" name="categories[]">
<option class="category" value="Income">Income</option>
<option class="category" value="Gender">Gender</option>
<option class="category" value="Age">Age</option>
</select>
//注意,我只顯示變量的可能選擇類別
<select multiple="multiple" id="variables" name="variables[]">
<option value="2">Less Than $15,000</option>
<option value="3">$15,000 - $19,999</option>
<option value="4">$20,000 - $29,999</option>
<option value="5">$30,000 - $39,999</option>
<option value="6">$40,000 - $49,999</option>
<option value="11">$90,000 - $99,999</option>
<option value="12">$100,000 - $124,999</option>
<option value="13">$125,000 - $149,999</option>
<option value="14">Greater than $149,999</option>
</select>
<select name="target[]" id="target" multiple="multiple" height="60">
</select>
而這裏的jQuery代碼:
$(function(){
var opts = {},
$cats = $("#categories"),
$target = $("#target"),
$vars = $("#variables");
$vars.find("option").each(function(){
var $opt = $(this),
cat = this.className,
value = this.value,
label = $opt.text();
if(!opts[cat]) { opts[cat] = []; }
opts[cat].push({label: label, value: value});
$opt.remove();
});
function update_variables(){
var cat = $cats.val(), new_opts = [];
$vars.empty();
$.each(opts[cat], function(){
if($target.find('[value=' + this.value + ']').length === 0){
new_opts.push(option(this.value, this.label));
}
});
$vars.html(new_opts.join(''));
}
function option(value, label){
return "<option value='" + value + "'>" + label + "</option>";
}
$("#add").click(function(e){
e.preventDefault();
$vars.find(':selected').appendTo($target).attr('selected',false);
update_variables();
});
$("#remove").click(function(e){
e.preventDefault();
$target.find(':selected').remove();
update_variables();
});
$cats.change(function(){
update_variables();
}).change();
})
它做...我沒有風搞清楚這一點。 :-) – n00b0101 2010-03-29 00:29:28