2017-05-05 121 views
1

我有一個使用jquery mobile和nativedroid2構建的小應用程序。根據標籤更改頁面名稱

我想知道是否有可能根據標籤名稱更改頁面標題名稱?

舉例http://jsfiddle.net/livewirerules/2a7so7r5/1/您將看到頁面標題爲Friends,而我的活動標籤爲Friends,所以當我移動到下一個標籤時。 Work頁面標題應該相應改變

下面是我的演示JS代碼

$(document).on("pagecreate", "#page1", function() { 
    $("div[role=main]").on("swipeleft", function (event) { 
     changeNavTab(true); 
    }); 

    $("div[role=main]").on("swiperight", function (event) { 
     changeNavTab(false); 
    }); 
}); 

function changeNavTab(left) { 
    var $tabs = $('ul[data-role="nd2tabs"] li'); 
    console.log($tabs); 
    var len = $tabs.length; 
    var curidx = 0; 
    $tabs.each(function(idx){ 
     if ($(this).hasClass("nd2Tabs-active")){ 
      curidx = idx; 
     } 
    }); 

    var nextidx = 0; 
    if (left) { 
     nextidx = (curidx >= len - 1) ? 0 : curidx + 1; 
    } else { 
     nextidx = (curidx <= 0) ? len - 1 : curidx - 1; 
    } 
    $tabs.eq(nextidx).click(); 

} 

任何幫助將不勝感激

回答

1

要附加到每個選項卡項目的點擊處理程序。只需將此代碼塊添加到您的$(document)函數中即可。併爲您的頁面標題元素設置一個ID。

<h1 id="heading" class="wow fadeIn" data-wow-delay='0.4s'>Friends</h1> 

$('ul[data-role="nd2tabs"] li').on('click',function(){ 
    $("#heading").html($(this).html()); 
}); 

下面是更新小提琴 http://jsfiddle.net/2a7so7r5/18/

+0

謝謝:)完美的作品 – LiveEn

1

我不知道什麼期望,但是這是我的aproach Modified example

function changeNavTab(left) { 
    var $active = $('ul[data-role="nd2tabs"] li.nd2Tabs-active'); 
    if(left){ 
     var $moveto = $active.next().length ? $active.next() : $('ul[data-role="nd2tabs"] li:first'); 
    }else{ 
     var $moveto = $active.prev().length ? $active.prev() : $('ul[data-role="nd2tabs"] li:last'); 
    } 
    var title = $moveto.text(); 
    $("h1.ui-title").text(title); 
} 
+0

您的解決方案是維護導航, upvoted! – deblocker