Javascript 如何在使用所选插件禁用selectbox后使其不可访问

我有这个选择框，禁用后仍然可以点击

我在我的选择框中使用选择的jquery插件

我的问题是禁用后，选择框是可单击的。我想在禁用后删除可单击的东西

测试链接：

jQuery代码：

$(".chosen-select").chosen();

$(".disable-chosen").on('click', function (event) {
    event.preventDefault();
    $(".chosen-select").attr("disabled", "disabled").trigger("chosen:updated");
    $(".disable-chosen").off('click');
});

---

如果您引用的是禁用后仍出现的大纲，则可以通过添加以下CSS避免在禁用选择后出现大纲

.chosen-disabled .chosen-single:focus{
    outline: none;
}

解释：原因是您的选择被转换为

div

（由您的插件）并且大纲属于

a

（锚定）元素，其中类为

选择的单个
。实际上，我们正在做的是，当
选择的disabled
类应用于该容器
div
（由插件生成）时，指示浏览器将
大纲设置为
none

为了更好地理解：（这是插件有效输出的内容）


懒熊

美国黑熊
亚洲黑熊
棕熊
大熊猫
树懒熊
太阳熊
北极熊
带眼镜熊

如果您引用的是禁用后仍出现的大纲，则可以通过添加以下CSS避免在禁用选择后出现大纲

.chosen-disabled .chosen-single:focus{
    outline: none;
}


解释：原因是您的选择被转换为
div
（由您的插件）并且大纲属于
a
（锚定）元素，其中类为
选择的单个
。实际上，我们正在做的是，当
选择的disabled
类应用于该容器
div
（由插件生成）时，指示浏览器将
大纲设置为
none

为了更好地理解：（这是插件有效输出的内容）


懒熊

美国黑熊
亚洲黑熊
棕熊
大熊猫
树懒熊
太阳熊
北极熊
带眼镜熊