将gif显示为选择选项

Question

我正在使用C＃，Razor，.Net Framework 4.7和jQuery 3.2.1开发ASP.NET MVC 5应用程序

我试图在选择中显示gif，而我用ajax加载其选项。

这是选择：

@Html.DropDownList("productionOrderId",
        new SelectList(Model, "ProductionOrderId", "Name"),
        @Resources.IndexAggLevelProOrdCaption,
        new { id = "ProductionOrderSelect", @class = "productSelect" })

这是将新选项加载到select中的jQuery：

function UpdateList(radioButton) {
    $('#productionOrderTable').empty()

    var URL = $(radioButton).data('checkaction');
    var phase = $(radioButton).val();

    var selectList = $("#ProductionOrderNameSelectId");
    var firstOption = selectList.find('option:first-child');

    selectList.find('option').remove();
    selectList.append('<option><img src="~/images/loadingDropDown.gif"/></option>');

    $.ajax({
        url: URL,
        type: "GET",
        dataType: "JSON",
        data: { phase: phase },
        success: function (response) {
            var selectList  = $("#ProductionOrderNameSelectId");
            //selectList.find('option').not(':first').remove(); // remove all elements except for first one
            //selectList.add(firstOption);

            //for (var i = 0; i < response.length; i++) {
            //  $(selectList).append(new Option(response[i].Item2, response[i].Item1))
            //}         
        },
        error: function (jqXHR, textStatus, errorThrown) {
            console.log(textStatus, errorThrown);
        }
    });
}

ajax函数中的内容已被评论，因为我正在检查为什么我看不到gif。

我试过这个：

selectList.append('<option><img src="~/images/loadingDropDown.gif"/></option>');

而且，在firefox中，我得到一个空选项：<option></option>。

我也尝试过：

selectList.append('<option style="background-image:url(~loadingDropDown.gif);"></option>');

但是在这里，它找不到图像。

图片位于~/image/文件夹中。

如何在选择中将图标显示为选项？