小编bha*_*pri的帖子

针对bootstarp单选按钮和切换按钮的Jquery插件兼容性

我使用boostrap版本3.3.7创建了一系列单选按钮.我还添加了一个功能,当我点击其中一个按钮时,单选按钮的颜色必须永久变为蓝色.当我使用版本bootstrap加载jQuery插件时,一切正常,如下所示

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Run Code Online (Sandbox Code Playgroud)

但是这会导致我已经实现的切换按钮出错,它应该作为下拉列表工作.如果我反转加载jquery和bootstrap的顺序,那么下拉列表将全部正常工作,导致单选按钮出错.我想提一下,单选按钮和切换按钮是我正在处理的不同功能.这已经成为一个棘手的问题需要解决.我可以知道哪个版本的jquery可以兼容Bootstrap版本3.3.7兼容的功能请查看下面的代码.

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li>
    <a href="#">
        <i class="glyphicon glyphicon-dashboard"></i>
        Dashboard
    </a>
    <a href="#pageSubmenu" data-toggle="collapse" aria-expanded="false" name="MontageSwap" id="MontageSwap"
       onchange="montageSwap(this.value);">
        <i class="glyphicon glyphicon-duplicate"></i>
        Montage
    </a>
    <ul class="collapse list-unstyled" id="pageSubmenu">
        <li><a href="#" id="1" ">Car</a></li>
        <li><a href="#" id="2" ">Bus</a></li>
        <li><a href="#" id="3" ">Bicycle</a></li>
    </ul>
</li>

<style>
    .btn-default {
        color: #D8D8D8;
        background-color: #D8D8D8;
        border-color: #D8D8D8;
    }

    .btn-default:hover {
        background-color: #5F5A66;
    }

    .btn-default.active {
        background-color: #4A90E2;
    }

</style>
<div class="w3-display-container col-md-12 col-sm-10 col-xs-8" style="position:relative;top:1px;bottom:0;">

    <div class="row">
        <div class="btn-group btn-group-justified" …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery twitter-bootstrap-3

0
推荐指数
1
解决办法
60
查看次数

标签 统计

html ×1

javascript ×1

jquery ×1

twitter-bootstrap-3 ×1