ajax动态下拉列表显示问题 如何解决

图片说明

根据设备号 ajax 动态查询异常 生成下拉列表

图片说明

此时更改了设备号 下拉列表没变

图片说明

第二次点击 后改变

我分析原因可能是操作太快 事件运行还没结束 等第二次点击 已经运行完

请问如何解决呢

ajax 代码

        $(document).ready(function () {
            $("#equipmentNo").change(function () {
            $.ajax({
                type: "POST",
                url: "/GuZhang/NoToCode",
                dataType: "json",
                data: { eno: $("#equipmentNo").val() },
                success: function (result) {
                    var dataObj = result;
                    $("#exceptionCode").empty();
                    var con = "<option value=''>----请选择----</option>";
                    $.each(dataObj, function (index, item) {
                        con += "<option value='" + item + "'>" + item + "</option>";
                    });
                    $("#exceptionCode").append(con);
                }
            });
        });
        });

把ajax改成同步的。

你的ajax是异步操作的
你改变了设备号 发起了请求 但是还没等数据返回就点击select 数据当然没变

可以在select那里弄一个loading之类的东西 在发起请求之前让它显示 select不可选
加载完成后隐藏loading 渲染数据 select可选

你是需要输入完设备号,带出异常代码的选择项是吧? 在最后的赋值【$("#exceptionCode").append(con);】这里用ID赋值不妥吧,因为解析的时候会按最新的元素进行赋值的

加个遮罩层,等加载完在进行下一步。

安装时指定的规则或默认的规则