Как добавить значение в выпадающий список в jquery

#jquery #html #css #jquery-mobile #cordova

#jquery #HTML #css #jquery-мобильный #кордова

Вопрос:

давайте рассмотрим многомерный массив, содержащий несколько записей, и у меня есть два выпадающих списка
1) list1
2) list2
Теперь
я хочу добавить значения массива в list2 путем изменения list1. Если значение list1 равно «-1», то list2 должен быть удален или скрыт. Еще пустой список 2, сделайте его видимым и вставьте значения из массива в список 1. Я сделал это, но есть некоторые запросы, которые я не смог решить. Пожалуйста, помогите мне.
Заранее спасибо.
Вот код:

 <select id="list1" onchange="changeVal(this.value);">
   <option value="-1">Select any option</option>
   <option value="0">test1</option>
   <option value="1">test2</option>
   <option value="2">test3</option>
</select>
<select id="list2">
</select>

function changeVal(i){
  var Arr = [
    ['Dummy 1.1','Dummy 1.2','Dummy 1.3'],
    ['Dummy 2.1','Dummy 2.2','Dummy 2.3'],
    ['Dummy 3.1','Dummy 3.2','Dummy 3.3']
];

if(i != "-1"){
    $("#list2").html("");
    $("#list2").css("visibility","visible");
    for (var addOption = 0; addOption < Arr[i].length; addOption  ){
        var option = $("<option></option>");
        $("#list2").append(option);
        option.html(Arr[i][addOption]);
    }
}

else{
      $("#list2").remove();
   }
}

Ответ №1:

чтобы добавить опцию для выбора, используйте это

  for (var addOption = 0; addOption < Arr[i].length; addOption  ) {
            $('#list2').append($('<option>', {
                value: addOption ,
                text: Arr[i][addOption] 
            }));
        }

ДЕМОНСТРАЦИЯ

1. как и до редактирования вашего вопроса, вы привязывали select с идентификатором appendSelect , но теперь вы привязываете list2 . итак, смотрите обновленный ответ.

2. Дорогой Амит Кумар, я хотел бы поблагодарить вас и поблагодарить за то, что уделили мне ваше драгоценное время.

Ответ №2:

попробуйте следующее:

 $('#list1').change(function () {   
var i = $(this).val();
if(i>-1){
  $('#list2').empty();
  $('#list2').show();
  for(var k=0;k<Arr[i].length;k  ){
    $('#list2').append(
        $('<option>', {
        value: Arr[i][k],
        text: Arr[i][k]
        }, '<option/>')
    );
  }
}
else{
   $('#list2').hide();
    }
});

эта скрипка поможет вам: http://jsfiddle.net/3nEWg/1 /