0

我有一个服务器端生成的选项列表，如下所示，

<select id="chosen">
    <option value="1">select 1</option>
    <option value="2">select 1</option>
    <option value="3">select 1</option>
    <option value="4">select 1</option>
    <option value="5">select 1</option>
</select>

根据选择的选项，数据将从服务器中提取并附加到表（行）

我想要实现的是，当我从选项列表中选择项目（使用 onChange）时，我想从列表中删除该选定项目（这样我就不会再次错误地重复选择相同的项目）

我已经编译了以下 onChange 脚本

    $("#chosen").change(function() {

        var data = "";
        var val = $("#chosen option:selected").val();           

        $.ajax({
            type:"GET",
            url : "pull_cust_inv.php",
            data : "invId="+$( "#chosen option:selected" ).val(),
            async: false,
            success : function(data) {
                $("#inv_list").append(data);
                //$("#chosen option:selected").remove();
            },
            error: function() {

                alert('Error occured');
            }
        });

        // REMOVE SELECTED OPTION
        $("#chosen option[value="+val+"]").remove();
    });

但是，由于某些奇怪的原因，该选项仍然出现在列表中（不会自行删除），但是当我第二次选择它时，它没有被选中。

有人可以建议我的代码有什么问题吗？

4

2 回答 2

0

''您在删除时失踪

尝试更换

$("#chosen option[value="+val+"]").remove();

和

$("#chosen option[value='"+val+"']").remove();

于 2018-10-27T01:21:42.377 回答
0

我自己想出了答案。我正在为选择下拉列表使用“选择”jquery 插件，因此传统方法（如下）将不起作用

$("#chosen option[value="+val+"]").remove();

解决方案 如果有人碰巧使用我使用“选择”（jquery 插件）实现的技术，删除选定选项的正确方法是编写以下行。

$("#chosen option[value="+val+"]").remove();
$("#chosen").trigger("chosen:updated");

意思是，一旦您“删除”选项元素，您将不得不触发“选择：更新”方法。

这仅意味着您使用的是所选的 Jquery UI 插件。

希望它可以帮助某人:)

于 2018-10-27T14:18:18.783 回答