如何讓Anchor Links在Jquery Mobile中工作？

Jquery Mobile已決定將錨鏈接視爲頁面請求。然而，如果你有一些博客文章有鏈接到同一頁面的鏈接（例如href =「＃specs」），那麼這不太好。如何讓Anchor Links在Jquery Mobile中工作？

有沒有辦法在特定的頁面上禁用jquery mobile的錨鏈接使用，我知道我不會使用它，所以我可以使用錨鏈接，因爲它們的意圖是，下拉到頁面的一部分？

我只需要一個錨鏈接解決方案在同一頁（即：href =「＃specs」）。

感謝

2012-02-25 David

你可以嘗試在錨標記添加data-ajax="false"。

鏈接沒有Ajax

鏈接指向其他結構域或具有相對=「外部」，數據AJAX =「假」或目標屬性將不會被加載使用Ajax。相反，這些鏈接將導致整個頁面刷新，而沒有動畫轉換。這兩個屬性（rel =「external」和data-ajax =「false」）具有相同的效果，但語義不同：rel =「external」應該在鏈接到另一個站點或域時使用，而 data- ajax =「false」對於簡單地選擇通過Ajax加載您的域中的頁面非常有用。由於安全限制，框架始終選擇從Ajax 行爲中選擇到外部域的鏈接。

參考 - http://jquerymobile.com/demos/1.0.1/docs/pages/page-links.html

來源

2012-02-26 05:17:29 user700284

謝謝!!!!!! – capdragon 2012-11-08 19:42:36

我想你的意思是把它放在鏈接標籤（而不是錨標籤）？ – 2013-03-30 04:06:06

當在同一個jQuery移動應用程序中鏈接到外部頁面（而不是鏈接）時，這也很有用，我的意思是，你有一個鏈接從'index.html'指向'create.html＃creations'。它有時用作JQM命令，但有時它不會，所以'data-ajax =「false」屬性是一個很好的解決方案。 – Francisco 2013-07-04 04:05:22

您可以將下面的代碼添加到您的網頁的結尾：

<script type="text/javascript"> 
    $('a.native-anchor').bind('click', function(ev) { 
     var target = $($(this).attr('href')).get(0).offsetTop; 
     $.mobile.silentScroll(target); 
     return false; 
    }); 
</script>

和類「天然錨」添加到您的錨鏈接。

這不是一個完全的溶劑，因爲瀏覽器的後退按鈕會將您移動到上一頁而不是鏈接的位置，但它比根本不工作的鏈接更好。

我在這裏發現了這個sollution：jQuery Mobile Anchor Linking

來源

2012-03-09 09:02:38

如果頁面是從另一個頁面（通常是JQuery移動平臺中的情況）加載ajax，則確保將代碼添加到data-role =「page」元素的末尾。 – 2012-03-09 09:08:07

$(document).bind("mobileinit", function() { 
    $.mobile.ajaxEnabled = false; 
});

來源

2013-02-08 18:53:24

如果你像我一樣，將現有的網站，你不想去通過每個頁面現在。您可以將一行代碼添加到您的標題中，並且您的所有標題和所有現有的內部定位鏈接都將添加data-ajax =「false」標記。

當然，這裏假定你已經在頭文件中包含了你自己的javascript文件。如果你不是，你將不得不觸摸每一頁。但是我有一個是包含在每個頁面已經這麼一個JavaScript文件，我加入這一行...

$("a").each(function() { if(this.href.indexOf("#")>=0) $(this).attr("data-ajax",false); });

這正好你的$（document）中。就緒（）塊。如果你還沒有那個塊，這裏是整個塊。

$(document).ready(function() { 
    $("a").each(function() { if(this.href.indexOf("#")>=0) $(this).attr("data-ajax",false); }); 
});

希望這會有所幫助。這是user700284提供的同樣的解決方案，但以自動方式。

來源

2013-11-17 16:01:31

-1

謝謝這個解決方案爲我

<script> 
    $(document).ready(function() { 
    $("a").each(function() { 
     if (this.href.indexOf("index.php") >= 0) $(this).attr("data-ajax", false); 
    }); 
    }); 
</script>

我換成#與index.php這是我的文檔根目錄。但是，它並不適用於表單按鈕即工作input type="submit"

來源

2015-10-23 04:45:04

首先，你必須這段代碼放到一個custom.js文件

$(document).bind('mobileinit', function() { 
    $.mobile.loader.prototype.options.disabled = true; 
    $.mobile.ajaxEnabled = false; 
    $.mobile.linkBindingEnabled = false; 
    $.mobile.loadingMessage = false; 
});

然後添加這個文件到您的網頁之前，jQuery Mobile的JS是加載。因爲'mobilinit'事件立即觸發

來源

2017-08-16 13:39:59

如何讓Anchor Links在Jquery Mobile中工作？

回答

相關問題