Select 从“选择”中选择2，但不更改边框颜色。

我已经在我的表单中添加了这个css规则，以便在需要时添加橙色边框

:required{
    border-color: #f8ac59 !important;
}

但这不适用于Select2，当我尝试使用此选项时，我会添加以下个人：

.select2-selection{
    border-color: #f8ac59 !important;
}

---

问题是，所有select2都有橙色边框，我只需要“select”输入中的select2带有required属性。我怎样才能解决这个问题

HTML

Selec。
Prueba 2最大值带
普鲁巴3号
普鲁巴4号
普鲁巴5号
函数myFunction（）{
var x=document.getElementById（“mySelect”）；
如果（x.value==“两个”）{
x、 style.border=“纯色橙色”；
}
否则{
x、 style.border=“无”；
}
}

---

希望这有助于

为了解决这个问题，有必要对票据的非货币化进行一些修改：

$('select').each(function () {
        $(this).off('change');
        var width= $(this).attr("data-width") || '100px';
        $(this).select2({
            theme: 'bootstrap4',
            placeholder: "Buscar y Selecionar",
            width: width,
            dropdownAutoWidth: true
        });
        var x = this.required;
        if(x){
            $(this).next().children().children().each(function(){
                $(this).css( "border-color", "#f8ac59" );
            });
        }
    });

---

问题是，所有select2都有橙色边框，我只需要“select”输入中的select2带有required属性。如何在样式的select2delete代码中解决这个问题，然后实现我发送给您的代码您不需要这个。select2选择{边框颜色：#f8ac59！重要；}：必需{边框颜色：#f8ac59！重要；}

$('select').each(function () {
        $(this).off('change');
        var width= $(this).attr("data-width") || '100px';
        $(this).select2({
            theme: 'bootstrap4',
            placeholder: "Buscar y Selecionar",
            width: width,
            dropdownAutoWidth: true
        });
    });

    <select id="mySelect" onchange="myFunction()" class="form-control form-control-sm" data-width="100%" required>
        <option value="one">Selec.</option>
        <option value="two">Prueba 2 max with</option>
        <option value="tree">Prueba 3</option>
        <option value="four">Prueba 4</option>
        <option value="five">Prueba 5</option>
    </select>

<script>
function myFunction() {
  var x = document.getElementById("mySelect");
  if(x.value == "two"){
    x.style.border = "solid orange";
  }
  else{
    x.style.border = "none";
  }
}
</script>

$('select').each(function () {
        $(this).off('change');
        var width= $(this).attr("data-width") || '100px';
        $(this).select2({
            theme: 'bootstrap4',
            placeholder: "Buscar y Selecionar",
            width: width,
            dropdownAutoWidth: true
        });
        var x = this.required;
        if(x){
            $(this).next().children().children().each(function(){
                $(this).css( "border-color", "#f8ac59" );
            });
        }
    });