如何追加选择内部循环

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何追加选择内部循环相关的知识,希望对你有一定的参考价值。

我试图在循环中追加选择选项,但我无法理解如何做到这一点。我在jquery中的常规代码是这样的:var myselect2 = $('');

  var myselect2 = $('<select>');
   myselect2.append( $('<option disabled selected value ></option >').val("").html("") );
       myselect2.append( $('<option ></option>').val("a").html("a") );
       myselect2.append( $('<option ></option>').val("b").html("b") );
       myselect2.append( $('<option ></option>').val("c").html("c") );
       myselect2.append( $('<option ></option>').val("d").html("d") );

           $('#health_institutions1').append(myselect2.html());

我的HTML代码是:

 <select multiple="" class="form-control" id="health_institutions1">

我正在尝试下面这段代码,但没有运气

  myselect2.append( $('<option disabled selected value ></option >').val("").html("") );
  $.ajax({
       type: 'GET',
       url: url()+'/patient_occupancies.json',
       dataType: 'json',
       success: function (datavalues1) {



         $.each(datavalues1, function( i, val ) {
                   var indicator1 = val.indicators;

                   if (indicator1 === 'Outpatient visits') {
                     var x = val.District;
                     myselect2.append( $('<option ></option>').val(x).html(x) );
                      //  console.log(textToInsert);
                  console.log(x);                   }

         });


       }
   });

$('#health_institutions1').append(myselect2.html());

它不起作用如何在我的案例中附加选项。

答案

像下面的代码应该达到你想要的。

var myselect2 = $('<select>');
myselect2.append($('<option disabled selected value ></option >').val("").html(""));

var items = ["a", "b", "c", "d"];
for (var i = 0; i < items.length; i++) {
    myselect2.append($('<option ></option>').val(items[i]).html(items[i]));
}

$('#health_institutions1').append(myselect2.html());

基本上我们正在创建一个包含4个值的数组itemsabcd。然后运行for循环将每个附加到myselect2

请记住,如果您正在进行AJAX调用,就像更新的问题一样,您需要在运行创建元素后将其附加到页面。这意味着您需要在AJAX回调中添加最终的附加内容。例如。

success: function(datavalues1) {
    $.each(datavalues1, function(i, val) {
        var indicator1 = val.indicators;

        if (indicator1 === 'Outpatient visits') {
            var x = val.District;
            myselect2.append($('<option ></option>').val(x).html(x));
            //  console.log(textToInsert);
            console.log(x);
            $('#health_institutions1').append(myselect2.html());
        }
    });
}

这将确保它只在AJAX调用成功后才会被追加。

以上是关于如何追加选择内部循环的主要内容,如果未能解决你的问题,请参考以下文章

jQuery的DOM操作

使用从循环内的代码片段中提取的函数避免代码冗余/计算开销

将一个嵌套字典中的选择项追加到另一个

php如何循环追加到变量

有人可以在快速数组中给出“如果不存在则追加”方法的片段吗?

使用for循环(Python)追加/连接多个excel数据集