我有一個依賴下拉列表(cat)的窗體,它依賴於從獨立下拉列表中選擇的值(item)。我想避免複製粘貼代碼,所以我希望有一個功能可以處理基於其獨立合作伙伴的多個下拉菜單。我不想顯式調用依賴元素,否則我將不得不導致複製粘貼難看的代碼。設置多個相關元素(JavaScript)
那麼,有沒有將元素綁定在一起,或綁定到元素?
實施例:
ITEM1 - > CAT1
ITEM2 - > CAT2
項目3 - > CAT3
var roleByCategory = {
A: ["Soup", "Juice", "Tea", "Others"],
B: ["Soup", "Juice", "Water", "Others"],
C: ["Soup", "Juice", "Coffee", "Tea", "Others"]
}
$("form").on("change", ".indi_ele", changeCat);
$(".indi_ele select").change();
function changeCat(event) { //should handle everything
var indie = $(event.target);
var depends = indie.closest('select').find('.gfield_select'); //dependent dropdown
var type = indie.val(); // this equals A, B, or C
var catOptions = "";
for (categoryId = 0; categoryId < roleByCategory[type].length; categoryId++) {
catOptions += "<option>" + roleByCategory[type][categoryId] + "</option>";
}
depends.html(catOptions);
}
我使用的值不是唯一的下拉列表。 item1與item2具有相同的選項。但item1只需要影響cat1 NOT cat2和item2只需要影響cat2等等。 這是我想解決的問題。嘗試將這些元素鏈接到一起,以便它們隻影響它們應該影響的元素 –