[英]how to update second select based on first select box in chosen prototype javascript?
我正在使用選擇的原型。 我想基於第一選擇框更新第二選擇框。 這個怎么做? 我可以觸發onchange事件,但是我無法基於第一個選擇框中的onchange事件來更新第二個選擇框。
<select class="chzn-select" id="one">
<option>one</option>
<option>two</option>
<option>three</option>
</select>
<select class="chzn-select" id="two">
</select>
$$('#one').each(function(select) {
new Chosen(select);
})
.invoke('observe', 'change', function() {
alert(document.getElementById("one").value);
//update the second select here
});
$$('#two').each(function(select) {
new Chosen(select);
})
.invoke('observe', 'change', function() {
alert(document.getElementById("two").value);
});
這是基於DOM的示例更新代碼:
// get value of #one
var v = document.getElementById("one").value;
// get select #two
var sel = document.getElementById("two");
// remove all options
while (sel.childNodes.length > 0) {
sel.removeChild(sel.childNodes[0]);
}
// add 2 new options
var o1 = document.createElement('option');
o1.innerHTML = v + '-one';
sel.appendChild(o1);
var o2 = document.createElement('option');
o2.innerHTML = v + '-two';
sel.appendChild(o2);
// update chosen
Event.fire($("two"), "liszt:updated");
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.