jQuery Mobile的和的link_to

下面的代碼工作在我的網站的桌面版本，也就是點擊按鈕鏈接到langs_path：jQuery Mobile的和的link_to

<%= link_to "Continue Quiz!", langs_path, class: "btn btn-large btn-primary"%>

爲我的網站的移動版本使用jQueryMobile我用這個：

<%= link_to "Continue Quiz!", langs_path, "data-transition"=>"slide", class: "ui-btn ui-corner-all buttonMargin"%>

當我使用手機版點擊繼續測驗！按鈕顯示一個永不消失的頁面加載器動畫。

當我看到鐵軌服務器我收到後點擊桌面版本的按鈕執行以下操作：

Started GET "/langs" for 127.0.0.1 at 2015-03-18 18:04:16 -0600 
Processing by LangsController#index as HTML 
    User Load (0.5ms) SELECT "users".* FROM "users" WHERE "users"."id" = 2 LIMIT 1 
    Lang Load (1.2ms) SELECT "langs".* FROM "langs" ORDER BY id LIMIT 10 OFFSET 321 
    Rendered shared/exercises/_learnEnglishSpeakSpanishWordScrambleSpanishTop.html.erb (0.7ms) 
    Rendered shared/_indexAction.html.erb (35.6ms) 
    Rendered langs/index.html.erb within layouts/application (36.5ms) 
    Rendered layouts/_shim.html.erb (0.0ms) 
    Rendered layouts/_header.html.erb (0.4ms) 
    Rendered layouts/_footer.html.erb (0.3ms) 
Completed 200 OK in 52ms (Views: 47.5ms | ActiveRecord: 1.7ms)

其次是所有的各種資產被服務。

當我看到鐵軌服務器我收到後點擊移動版按鈕，如下：

Started GET "/langs" for 127.0.0.1 at 2015-03-18 18:17:25 -0600 
Processing by LangsController#index as HTML 
    User Load (1.0ms) SELECT "users".* FROM "users" WHERE "users"."id" = 2 LIMIT 1 
    Lang Load (0.8ms) SELECT "langs".* FROM "langs" ORDER BY id LIMIT 10 OFFSET 321 
    Rendered shared/exercises/_learnEnglishSpeakSpanishWordScrambleSpanishTop.mobile.erb (0.1ms) 
    Rendered shared/_indexAction.mobile.erb (2.7ms) 
    Rendered langs/index.mobile.erb within layouts/application (3.1ms) 
    Rendered layouts/_shim.mobile.erb (0.0ms) 
    Rendered layouts/_header.mobile.erb (0.3ms) 
    Rendered layouts/_footer.mobile.erb (0.3ms) 
Completed 200 OK in 22ms (Views: 16.6ms | ActiveRecord: 1.7ms)

隨後被服務的單一資產。

我可以在兩者之間找到的唯一差異是正在服務的資產數量和移動與桌面視圖的服務數量。兩個link_to方法都使用相同的控制器代碼。

有什麼想法可能會導致此？

EDIT1：

另一個有趣的現象是：

當我在桌面上的版本，然後單擊繼續測驗的鏈路是否如上所述。如果在測驗頁面的桌面版本上切換到測驗頁面的移動視圖的移動視圖。單擊回到繼續測驗鏈接所在的移動主頁，然後單擊繼續測驗按鈕現在可以在之前沒有的地方進行。

這裏有一些圖片來幫助說明上述：

首先這個問題，點擊繼續競猜掛在主頁上。你可以看到聯繫人鏈路上的加載圖標：

enter image description here

現在開始在桌面上的網頁： enter image description here

並點擊繼續測驗：

enter image description here

現在切換到移動視圖： enter image description here

產生如下： enter image description here

現在要回移動主頁，並點擊繼續測驗工作： enter image description here

任何想法？這一個讓我難住。

來源

2015-03-19 mtcrts70

這是錯誤，我自己也遇到過。由於jQuery動畫和turbolinks的錯誤，應該被觸發的動畫不會被觸發。我想如果你設置通過remote: false到鏈接它應該工作。否則，您可以在移動版本或應用程序中完全禁用turbolink。這無疑是與turbolink相關的，並且remote: false傳遞給link_to幫助程序將阻止turbolinks在該鏈接上進行操作，因爲它會將data-remote="false"插入瀏覽器中呈現的鏈接。

另一個說明，你在哪裏加載javascript，在<head>或之前</body>？如果您將它裝入頭部，請將其移至下半身。

來源

2015-03-27 19:33:20

移動JS較低的伎倆。謝謝！ – mtcrts70 2015-03-29 16:03:48

我看到的區別是，您將"data-transition"=>"slide"添加到移動版本。這顯然是應該觸發一個jQueryMobile幻燈片轉換，但這不能正常工作，這就是爲什麼「你堅持一個永不消失的頁面加載器動畫。」

我不能告訴你爲什麼它不起作用，但這是問題，jQuery Mobile幻燈片轉換不起作用。你可以找出原因，或者只是刪除數據轉換屬性。

JQuery Mobile轉換可能與您正在進行的其他操作不兼容，或許Turbolinks默認情況下在最新版本中安裝了Rails。您可以嘗試禁用Turbolinks，無論是在移動版本還是在任何地方。 http://blog.steveklabnik.com/posts/2013-06-25-removing-turbolinks-from-rails-4

來源

2015-03-19 02:12:18 jrochkind

感謝您的輸入！我從link_to中刪除了「data-transition」=>「slide」，但問題依然存在。另外，當我用另一個路徑替換langs_path時，例如about_path，transition和link_to按預期工作。 – mtcrts70 2015-03-20 01:09:26

這裏是你可以做什麼

檢查在瀏覽器控制檯的js錯誤
檢查的開發工具的網絡標籤，看是否有從server.And響應該請求沒有失敗。
檢查是否存在回調，以便jQuery手機獲得響應的時間。它需要知道如何處理返回的內容。 - 可能在你的情況下，這不是必需的，因爲你只是想打開一個頁面。
您的rails控制器是否爲XHR請求返回不同的內容？這肯定會導致這個問題。
如何不使用jQuery，只是做一個簡單的重定向如：this.location.href =「」？

來源

2015-03-25 10:54:35

jQuery Mobile的和的link_to

回答

相關問題