IE中的下拉框在单击事件时不刷新

Dropdown in IE does not refresh in click event

本文关键字:事件 单击 刷新 IE      更新时间:2023-09-26

我有一个下拉菜单,其中有一个'点击'事件,我调用rest服务,并使用jquery更新下拉菜单中的选项,所以问题是,选项在IE中没有得到更新。它工作在铬&别人。

示例代码

       <select class="dropdown">
          <option value="1">Column1</option>
          <option value="2">Column2</option>
        </select>
         $(.dropdown).click(function () {
            var $dropdown = $(this);
            var contrId = $(this).attr('id');
            var selectedVal = $(this).val();
            $($dropdown).empty();
            $.ajax({
                url: '@Url.Content("~/FakeAPI/GETDATA")',
                dataType: "json",
                method: 'POST',
                data: { 'id': '10' },
            }).done(function (data) {
                // Clear drop down list
                $($dropdown).empty();
                // Fill drop down list with new data
                var $option = $("<option />");
                $option.attr("value", '').text('Select Column');
                $($dropdown).append($option);
                $(data).each(function () {
                    // Create option
                    var $option = $("<option />");
                    // Add value and text to option
                    $option.attr("value", this.Text).text(this.Value);
                    if (selectedVal == this.Text) {
                        $option.attr("selected", "selected");
                    }
                    // Add option to drop down list
                    $($dropdown).append($option);
                });
            });
        });
    }

在i.e. 9,10和11测试中工作

$(document).ready(function () {
            $(".dropdown").click(function () {
                var $dropdown = $(this);
                var contrId = $(this).attr('id');
                var selectedVal = $(this).val();
                $($dropdown).empty();
                $.ajax({
                    url: '@Url.Content("~/FakeAPI/GETDATA")',
                    dataType: "json",
                    method: 'POST',
                    data: {'id': '10'},
                }).done(function (data) {
                    // Clear drop down list
                    $($dropdown).empty();
                    // Fill drop down list with new data
                    var $option = $("<option />");
                    $option.attr("value", '').text('Select Column');
                    $($dropdown).append($option);
                    $(data).each(function () {
                        // Create option
                        var $option = $("<option />");
                        // Add value and text to option
                        $option.attr("value", this.Text).text(this.Value);
                        if (selectedVal == this.Text) {
                            $option.attr("selected", "selected");
                        }
                        // Add option to drop down list
                        $($dropdown).append($option);
                    });
                });
            });
        });

我认为问题是IE缓存请求错误。将cache:false添加到ajax请求中,可能会通过在请求末尾添加_={timestamp}来解决问题。

$.ajax({
       cache:false,
       url: '@Url.Content("~/FakeAPI/GETDATA")',
       dataType: "json",
       method: 'POST',
       data: { 'id': '10' },