選擇包含HTML的變量的下拉選項

Question

變量包含html

var empDaysStatusDropDown =
"<select class='statusList form-control'><option value='1'>Official On</option><option value='2'>Official Off</option><option value='3'>Sick Leave</option><option value='4'>Casual Leave</option><option value='5'>Annual Leave</option></select>"

我想通過選擇任何下拉選項通過編程來更新此html？

意味着我想選擇下拉菜單0、1、2、3中的任何一個，並相應地更新html，以便當我在頁面上顯示html時，該選項將被選中，我首先選擇

Answer 1

編輯：

我也為此創建了小提琴： 演示

據我說，您需要先實現它，然后再將其添加到頁面中。 因此，您想在jquery中對其進行操作，我們開始：

var empDaysStatusDropDown =
$("<select class='statusList form-control'><option value='1'>Official On</option><option value='2'>Official Off</option><option value='3'>Sick Leave</option><option value='4'>Casual Leave</option><option value='5'>Annual Leave</option></select>");
empDaysStatusDropDown.find('option[value="1"]').attr('selected','selected');
// now you can append empDaysDropDown anywhere on the page.
$('body').append(empDaysStatusDropDown);

希望這可以幫助 ：）

Answer 2

Try this
$(document.body).on("change",".statusList",function(){
  if(".statusList option:selected").val()=="1"){
   empDaysStatusDropDown ="new html";
  }
})