Javascript 如何在更改事件上添加fadeIn Jquery

我有一个

，里面有一个

元素。我正在进行一个AJAX调用，然后将返回的数据追加到段落中。我希望

标记和所有相关CSS在

更改事件中淡入。以下是我目前的代码：


$（'scenarioDropdownList'）。更改（函数（）{
var scenarioId=$（'#scenarioDropdownList选项：selected'）.attr（'id'）；
getscenarioDescription（scenarioId）；
getData（场景ID）；
});
函数getscenarioDescription（scenarioId）{
$.ajax({
键入：“获取”，
网址：'https://localhost:44340/api/ScenarioDescriptors/GetScenarioDescriptions',
数据：{
场景类：场景类
},
数据类型：“JSON”，
成功：功能（数据）{
$。每个（数据、函数（键、值）{
$（'描述显示'）.text（val.scenarioDescription）；
});
},
错误：函数（）{
}
});
}
#说明显示{
边框：实心1px黑色；
字体系列：“SourceSansPro”，Arial，无衬线；
填充：10px；
背景色：#EBEBE4；
光标：不允许；
边缘顶部：20px；
}


如果我理解正确，这将对您有所帮助。包括事件更改和加载ajax后的动画


$（'scenarioDropdownList'）。更改（函数（）{
$（'#descriptionDisplay'）。（“慢”，函数（）{
//动画完成。
});
var scenarioId=$（'#scenarioDropdownList选项：selected'）.attr（'id'）；
getscenarioDescription（scenarioId）；
getData（场景ID）；
});
函数getscenarioDescription（scenarioId）{
$.ajax({
键入：“获取”，
网址：'https://localhost:44340/api/ScenarioDescriptors/GetScenarioDescriptions',
数据：{
场景类：场景类
},
数据类型：“JSON”，
成功：功能（数据）{
$。每个（数据、函数（键、值）{
$（'描述显示'）.text（val.scenarioDescription）；
});
$（'#descriptionDisplay'）。淡出（“慢”，函数（）{
//动画完成。
});
},
错误：函数（）{
}
});
}
当用户更改选项时，需要淡出段落元素，以便在更改文本后淡入

$('#scenarioDropdownList').change(function() {
      var scenarioId = $('#scenarioDropdownList option:selected').attr('id');
      // Fade out
      $('#descriptionDisplay').fadeOut();
      getscenarioDescription(scenarioId);
      getData(scenarioId);
    });

    function getscenarioDescription(scenarioId) {
      $.ajax({
        type: "GET",
        url: 'https://localhost:44340/api/ScenarioDescriptors/GetScenarioDescriptions',
        data: {
          scenarioId: scenarioId
        },
        dataType: 'JSON',
        success: function(data) {
          $.each(data, function(key, val) {
            // Fade in
            $('#descriptionDisplay').text(val.scenarioDescription).fadeIn();
          });
        },
        error: function() {

        }
      });
    }