Bootstrap-select.js-选择一个选项后，整个选择将消失

Bootstrap-select.js - After selecting an option, entire select disappears

本文关键字：选择 消失 选项 js- Bootstrap-select 一个      更新时间：2023-09-26

我正试图为我正在工作的网站（Magento版本1.9.1.0）设置bootstrap-select.js，但我遇到了一些无法解决的问题。

所有东西都加载得很完美，但当我在下拉选择列表中选择一个选项时，整个选择会通过在上面添加一个element.style而消失，如下所示：

style="display:none;"

在FireBug中，它说：

element.style {
display: none;
}

请在此处查看视觉图像：http://i.imgur.com/cg1jkOp.jpg?1

问题是我不知道这个样式是从哪里来的，所以我决定在FireBug中查看"属性更改中断"，看看它是怎么说的。代码来自Jquery（Jquery-2.1.3.min.js），如图所示：http://i.imgur.com/Jbu8TCx.jpg?1

这就是我在<head>部分中的内容：

<link rel="stylesheet" href="http://localhost/sg-magento/skin/frontend/ultimo/default/css/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="http://localhost/sg-magento/skin/frontend/ultimo/default/css/bootstrap/bootstrap-select.min.css">
<script type="text/javascript" src="http://localhost/sg-magento/js/infortis/jquery/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="http://localhost/sg-magento/skin/frontend/ultimo/default/js/bootstrap/bootstrap.min.js"></script>
<script type="text/javascript" src="http://localhost/sg-magento/skin/frontend/ultimo/default/js/bootstrap/bootstrap-select.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
   $('.selectpicker').selectpicker();
});
</script>

我该何去何从？我该如何解决这个问题？这似乎是一件小事，但现在真的让我很紧张。我想了很久了。

希望有人愿意帮忙。

谢谢。

这是因为Bootstrap和Prototype冲突。点击此处查看更多详细信息。创建一个新的JS文件并在其中添加以下代码。

if (Prototype.BrowserFeatures.ElementExtensions) {
var disablePrototypeJS = function (method, pluginsToDisable) {
        var handler = function (event) {
            event.target[method] = undefined;
            setTimeout(function () {
                delete event.target[method];
            }, 0);
        };
        pluginsToDisable.each(function (plugin) { 
            jQuery(window).on(method + '.bs.' + plugin, handler);
        });
    },
    pluginsToDisable = ['collapse', 'dropdown', 'modal', 'tooltip', 'popover'];
disablePrototypeJS('show', pluginsToDisable);
disablePrototypeJS('hide', pluginsToDisable);}

玩得开心：）

我也遇到过类似的问题，在提交和重新渲染Backbone模板时，select消失了。在我的例子中，调用$（'.selectpicker'）.selectpicker（'ender'）；修复它。

$( ".dropdown-menu > ul > li" ).click(function() {
$( '.bootstrap-select').attr('style', '');
$( this ).parent( '.bootstrap-select').attr('style', '');
});

这将覆盖导致此问题的任何冲突。我不相信前面的任何一个答案都是正确的。我的DEF不是一个答案。但它会解决问题，直到可以花更多的时间找到冲突的真正根源。原型可能是原因，但原型答案不起作用！

相关文章：