大纲已动态添加

问题jQuery的选上的选择框：大纲已动态添加

我加入一个Chosen Select箱动态的页面。点击按钮后，我想用红色勾选选中的框。我可以通过在下面的CSS中添加一个具有下面CSS属性的类来输入框，但是选择框的边框不会改变。

.redOutlineTextBox { 
    border:2px solid #FF0000; 
}

我知道这是可以改变所选择的控制轮廓颜色，因为如果我在页面加载添加以下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); 
}

下面的小提琴设置了两个动态添加的Chosen选择框和一个输入框的示例。

我想发生：

在点击按钮时，首先选择框和输入框的红色应该概括为.redOutlineTextBox类添加到他们两人，但最后选择框不应该突出。

JSFiddle

事情我已经尝试：

我设置已选择框中的设置继承选择类。

$(".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');

来源

2016-05-31 James Small

如果你只是想突出你可以做到这一点的盒子：

$(".chosen-container input").addClass('redOutlineTextBox')

如果你想突出显示所有文本输入框，无论其他类的，这样做：

$("input[type='text']").addClass('redOutlineTextBox')

来源

2016-05-31 22:29:18

我尝试了上述方法，但没有奏效。请参阅：https://jsfiddle.net/yyjv9d8j/9/ –

我点了你的小提琴，它确实有效。你使用的是什么浏览器？ –

IE 11.当你说它的工作原理时，你是说所选框突出显示，还是中间突出显示的输入框？输入框只需将.redOutlineTextBox类添加到#inputTest即可。 –

您正尝试将该类添加到#chosenTest选择中，但该元素实际上并不可见。可见元素只是一个输入字段。我不知道选择的不够好，不知道是否可以指定该元素的ID，但我可以像这样添加类：

$("#chosenTest_chosen input").addClass('redOutlineTextBox');

来源

2016-05-31 22:29:48

您正确的看法是#chosenTest元素不可见，但#inputTest元素也不可见，并且将该类添加到#inputTest中，但对#chosenTest元素不起作用。输入元素也是动态添加的。我试过上面的代码，它不起作用。请参阅：https：//jsfiddle.net/yyjv9d8j/8/ –

经过调查，这是行得通的，但仅限于Chrome，我们无法使用这个内部Intranet站点。它必须与IE11一起使用。 –

大纲已动态添加

回答

相关问题