jQuery手機網站與多個文件

我正在使用jQuery Mobile的移動友好的網站上工作，但希望使用多個HTML文件，每個都有一個data-role =「page」div（而不是多個數據 - 角色=「頁面」div在一個文件中似乎是標準），因爲這可以最大限度地重用現有網站。我知道我可以在主頁的<a>標籤上使用的整個data-ajax =「false」概念，但是這會禁用我們真正喜歡的頁面轉換效果。jQuery手機網站與多個文件

我試過pageshow，pagebeforeshow，pageinit，document.ready等等，但沒有一個會直接進入那個頁面，而不是跟隨從主頁面的鏈接，即TOC（或刷新從TOC鏈接後的頁面）。所以基本上，我的JS文件看起來像：

('div[data-role="page"]:first').live('pageshow',function(){ /*do custom stuff here */})

我也嘗試添加引用這個JS文件到TOC頁面，但沒有運氣......我有種預期，但我想我會嘗試。我發現很難相信JQM不會以這種方式支持網站（不會失去轉換效果），所以我可能會錯過簡單的東西。

來源

2012-03-27 user1263226

您使用的是哪個版本的Jquery和Jquery Mobile？ – codaniel 2012-03-27 22:54:09

當我在提交後重新閱讀我的問題時，它很快就打了我，然後我試了一下並確認了我的懷疑......問題出在我的選擇器上... div [data-role =「page」]：first如果我正在關注TOC中的鏈接，則選擇TOC頁面的第一頁div。所以我開始在我的div上使用ID ......我應該一直這樣做......並且它開始工作了！ – user1263226 2012-03-27 23:09:46

我很高興你明白了。賈斯珀的回答是一件很重要的事情。現場有一些已知的問題。此外，ID的工作更好。如果你使用Jquery 1.7.x使用.on（）方法而不是live。 – codaniel 2012-03-27 23:14:20

.live()折舊，所以使用.delegate()：http://api.jquery.com/on
你應該綁定到的ID，而不是使用多個僞選擇（我想這是你的問題，你的複雜的選擇可能是無效的事件委託）：

。

$(document).delegate('#my-page-id', 'pageinit', function() { 
    //you can now do work for the `#my-page-id` pseudo-page 
});

如果你希望綁定到所有的僞頁面做一些全球範圍內，你可以使用：

$(document).delegate('[data-role="page"]', 'pageinit', function() { 
    //you can now do work for all the `[data-role="page"]` "pages" 
});

或者你可以把在不同data-role="page"要素類指定要哪一個綁定到。

來源

2012-03-27 22:57:24 Jasper

當我在提交後重新閱讀我的問題時，很快就打到了我，然後我嘗試了並確認了我的懷疑......問題出在我的選擇器上......'div [data-role =「page」]：第一個'選擇TOC頁面的第一頁div *如果我正在跟蹤TOC的鏈接。所以我開始在我的div上使用ID ......我應該一直這樣做......並且它開始工作了！ – user1263226 2012-03-27 23:08:09

猜猜這正是你所說的嘿，所以我將其標記爲答案（在我興奮的情況下，我沒有閱讀所有帖子）...雖然現在我有一個新問題，它只適用於第一個頁面從目錄加載，每個單獨的文件都有「下一個」和「上一個」導航按鈕，當我使用那些我有類似的問題，任何想法爲什麼？但如果我從TOC轉到一個頁面，然後點擊該頁面的目錄，然後從那裏進入下一頁，這很好... – user1263226 2012-03-28 00:08:03

jQuery手機網站與多個文件

回答

相關問題