Javascript 如何在html选择中使用bootstrap 4 popover

Popover无法正常工作…它只允许我选择一个选项一次

这是我的密码

<select name="criteria[]" class="criteria form-control" data-original-title="" title="">
    <option value="=" rel="">=</option>
    <option value=">" rel="">&gt;</option>
    <option value=">=" rel="">&gt;=</option>
    <option value="<" rel="">&lt;</option>
    <option value="<=" rel="">&lt;=</option>
    <option value="!=" rel="">!=</option>
    <option value="like" rel="Use % for wildcards">LIKE</option>
    <option value="not_like" rel="Use % for wildcards">NOT LIKE</option>
    <option value="where_in" rel="Please Input Comma Separated List">IN</option>
</select>

请帮我解决这个问题

$（document）.on（'change'，“.criteria”，function（））{
var _this=$（this），rel=_this.find（“选项：选定”）.attr（“rel”）；
如果（rel）{
$（这个）({
标题：“说明”，
内容：rel，
位置：“顶部”，
延迟：{显示：500，隐藏：100}
});
}
});

=
=
=
!=
喜欢
不像
在里面
它的工作原理与我的测试中的相同，但这里有一些建议和工作演示


$（document）.on（'change'，'criteria'，function（））{
var_this=$（this），
rel=_this.find（“option:selected”）.attr（'rel'）；
if（rel=''）{/--------------为简单起见，反转逻辑
_这个.popover（'dispose'）；
}否则{
_this.popover（{//-----------如果重建，则无需处置popover
标题：“说明”，
内容：rel，
位置：“自动”，
延迟：{显示：500，隐藏：100}
});
}
});

=
=
=
!=
喜欢
不像
在里面
如果对您的更改进行一些解释，您的答案会更好。此外，弹出框甚至显示为空的
rel
值。我这样添加if（rel！=''）-我的问题是，当我选择一个选项时，它会弹出一条消息，但当我再次单击时，它会很快下拉列表，因为我无法选择任何选项，而您正在加载引导3。为什么它在这里工作，但不在我的页面中…在我的页面中，它只允许我选择一个选项一次，然后它不会让我选择任何其他选项如果我尝试再次选择，则下拉列表会一直闪烁
$(document).on('change', ".criteria", function(){
    var _this=$(this), rel=_this.find("option:selected").attr("rel");
    if(rel!=''){
        _this.popover('dispose').popover({
            title: 'Instruction',
            content: rel,
            placement: "top",
            delay: { show: 500, hide: 100 }
        });
        return;
    }else{
        _this.popover('dispose');
    }
});