標簽navtab

創建navtab

 

創建一個navtab有以下兩種方式：

1、Data屬性：DOM添加屬性data-toggle="navtab"后，單擊觸發。

a鏈接示例：

<a href="form/other.jsp" data-toggle="navtab" data-id="mynavtab" data-reload-warn="已打開業務界面，確認將重新載入？" data-title="我的業務界面">打開navtab</a>

按鈕示例：

<button type="button" class="btn-green" data-toggle="navtab" data-id="mynavtab" data-title="我的業務界面" data-reload-warn="已打開業務界面，確定將重新載入？" data-url="form/other.jsp">打開navtab</button>

參數集合寫法：

<button type="button" class="btn btn-blue" data-toggle="navtab"
                            data-options="{id:'mynavtab',reloadWarn:'已打開業務界面，確認將重新載入？',url:'form/other.jsp',title:'我的業務界面（參數集合寫法）'}">打開navtab</button>

其他示例（回調函數）

<script type="text/javascript">
                        function doc_navtab_beforeClose($navtab){
                            var code=$navtab.find("#doc-mytab-code").val();
                            if(code) return true;
                            $navtab.alertmsg('error','關閉navtab前請先輸入你的工號');
                            return false;
                        }
                        function doc_navtab_onClose(){
                            $(this).alertmsg('info','你剛剛關閉了一個navtab');
                        }
                    </script>
                    <button type="button" class="btn-green" data-toggle="navtab" data-id="mynavtab" data-reload-warn="已打開業務界面，確認將重新載入？" data-url="form/other.jsp"
                            data-title="navtab回調函數示例" data-before-close="doc_navtab_beforeClose" data-on-close="doc_navtab_onClose">打開navtab</button>

 

2、jqueryAPI的方式

<script type="text/javascript">
                        function openMytab(obj){
                            $(obj).navtab({id:'mynavtab', url:'form/other.jsp', title:'我的業務界面'});
                        }
                    </script>
                        <button type="button" class="btn btn-default" onclick="openMytab(this)">打開navtab</button>

jqueryAPI代碼：

$(selector).navtab(options);

 

注意：

1、取得當前navtab的內容容器：$.CurrentNavtab

2、創建已存在相同ID的navtab時，如果url一致（未設置refresh參數時），默認會直接切換到該navtab，否則覆蓋已存在的navtab，可以增加reloadWarn參數以獲得警告提醒。