问题:
我正在添加 Chosen Select框动态到页面。单击按钮后,我想用红色勾勒出选择框。我已经可以为输入框执行此操作,例如通过将下面带有 CSS 的类添加到适当的 ID,但选择框的边框永远不会改变。
.redOutlineTextBox {
border:2px solid #FF0000;
}
我知道可以更改 Chosen 控件的轮廓颜色,因为如果我在加载页面时添加以下 CSS,所有选择的框都将按预期显示轮廓。
.chosen-container .chosen-single {
border:2px solid #FF0000;
box-shadow: 0 0 3px #FFF inset, 0 1px 1px rgba(0, 0, 0, 0.1);
}
下面的fiddle设置了两个动态添加的Chosen选择框和一个输入框的例子。
我希望发生的事情:
单击按钮后,第一个选择的框和输入框应显示为红色轮廓,因为 .redOutlineTextBox 类已添加到它们,但最后选择的框不应突出显示。
我尝试过的事情:
我已经设置了 Chosen 框的设置继承选择类。
$(".chosen-select").chosen({
width: "30%",
search_contains: true,
no_results_text: "No Results Found",
max_selected_options: 5,
inherit_select_classes: true
});
根据 Chosen 文档,您可以触发更新。添加 .redOutlineTextBox 类后,我尝试调用此更新但没有结果。
$('.chosen-select').trigger('chosen:updated');
最佳答案
您正在尝试将类添加到 #chosenTest 选择中,但该元素实际上并不可见。可见元素只是一个输入字段。我不太了解 Chosen,不知道您是否可以为该元素指定一个 id,但我能够像这样向它添加类:
$("#chosenTest_chosen input").addClass('redOutlineTextBox');
关于javascript - 动态添加的 Outline Jquery Chosen 选择框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37556436/