一,點選即開啟
1,點選按鈕

<a href="javascript:void(0)" class="btn btn-primary" data-toggle="modal" data-target="#test" onclick="toApiTestPage()">API測試工具</a>

2,模態框

<div class="modal fade" id="test" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog"
 
 role="document" style="width:1000px;">
        <div class="modal-content bgwhite">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <i class="fa fa-times-circle" aria-hidden="true"
 
></i>
                </button>
                <h4 class="modal-title" id="myModalLabel2">API測試</h4>
            </div>
            <div class="modal-body requestDiv" style="height: 450px;overflow-y: auto">
                <ul class="ul-tab">
                    <
 
li>
                        <strong>介面地址</strong>
                        <span id="apiUrl"></span>
                        <input id="requestApiUrl" type="hidden"/>
                    </li>
                </ul>
            </div>
            <div class="modal-footer center">
                <a href="javascript:void(0)" class="btn btn-primary" data-dismiss="modal">完成除錯</a>
                <a href="javascript:void(0)" class="btn btn-default" data-dismiss="modal">取消</a>
            </div>
        </div>
    </div>
</div>

點選1中的"API測試工具"即可開啟彈窗

二,點選的先呼叫js方法判斷是否要開啟

1,點選按鈕:相比一.1 去掉了[data-toggle="modal" data-target="#test"]

<a href="javascript:void(0)" class="btn btn-primary" onclick="toApiTestPage()">API測試工具</a>

2,彈窗不變

3,在方法toApiTestPage()中

function toApiTestPage(){
    if (滿足條件){
        //此時開啟彈窗
        $("#test").modal("show");
    }else {
        $("#test").modal("hide");
    }
}