javascript - 如果使用jquery ajax表中的数据，如何动态选择下拉列表

Question

我附上了一张 table 的图片。数据(语言和排名)通过 jQuery AJAX 从该表中获取。请检查数据列表的示例图像。

我的问题是在下拉列表中，我需要显示在页面加载时选择了检索数据(排名)。目前德语正确意味着排名显示 3，但英语下拉列表显示错误。但排名响应显示 alert(getRankingRate); 结果是 2 和 3。

$.get("/language/ranking/get", function(responseDB){
        var getrankingDB = '';
        var getRankingRate = 0;
        var getRankingID   = 0;
        $.each(responseDB.selectLanguageRankingTagId,function(i, item) {
          getRankingID    = item.id;
          getRankingRate  = item.ranking;
          getLanguageName = item.title_en;
          getrankingDB += '<div class="row"><div class="col-md-8"><h4 style="background-color: lightgrey; border-radius: 10px; background-repeat: repeat; height: 30px; margin:5px 0px; padding:4px 5px;">'+getLanguageName+'</h4></div><div class="col-md-3" style="padding:5px;"><select class="form-control input-sm" id="getRankingLanguage_'+getRankingID+'"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option></select></div></div>';
          $( ".loadlanguagemodal" ).html('<div class="modal-content"><div class="modal-header loadlanguagemodal"><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button><h4 class="modal-title">Edit Languages</h4></div><div class="modal-body">'+getrankingDB+'<div class="appendRow"></div></div><div class="modal-footer"><div class="row"><select class="form-control input-sm"><option selected="selected">Add Language</option>'+optionLang+'</select></div><br><button type="button" class="btn btn-default" data-dismiss="modal">Close</button><button type="button" class="btn btn-primary">Save changes</button></div></div>').fadeIn( "slow" );
        //alert(getRankingID);
        $('#getRankingLanguage_'+getRankingID).val(getRankingRate);
        });
});

Answer 1

您可以在这里大大简化事情并使用 jQuery 的行为来选择 <select>元素的选项由其“value”属性决定。这是一个示例:https://jsfiddle.net/avkj0qwm/

您的<select>元素应具有基于其 RankingID 的唯一 ID，例如:

<select class="form-control input-sm" id="getRankingLanguage_'+getRankingID+'">

然后您就可以定位正确的 <select>和<option>元素，例如:

$('#getRankingLanguage_'+getRankingID).val(getRankingRate);

希望这有帮助!如果您需要更多信息，请告诉我!