Javascript 如何让锚链接在Jquery Mobile中工作？

jquerymobile已决定将锚定链接视为某种页面请求。但是，如果你有大量的博客文章都有指向同一页面的锚链接（ie href=“#specs”），这就不好了

有没有一种方法可以在我知道我不会使用的特定页面上禁用jquery mobile的锚定链接使用，这样我就可以按预期使用锚定链接，从而下拉到页面的一部分

我只需要为同一页面上的锚链接提供解决方案（即：href=“#specs”）

---

谢谢

您可以尝试在锚标记上添加

数据ajax=“false”

不使用Ajax的链接

指向其他域或具有rel=“external”的链接， 数据ajax=“false”或目标属性不会使用ajax加载。 相反，这些链接将导致整个页面刷新，而不显示动画 过渡。两个属性（rel=“external”和data ajax=“false”） 具有相同的效果，但语义不同：rel=“external” 链接到其他站点或域时应使用，而 data ajax=“false”对于简单地选择页面非常有用 域不允许通过Ajax加载。由于安全限制,， 该框架总是在Ajax之外选择指向外部域的链接 行为

---

参考-

您可以在页面末尾添加以下代码：

 <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>

$（'a.native-anchor'）.bind（'click'，函数（ev）{
var target=$（$（this.attr（'href'））.get（0.offsetTop；
$.mobile.silentsroll（目标）；
返回false；
});

并将类“本机锚定”添加到锚定链接中

这不是一个完全的解决方案，因为浏览器的“后退”按钮会将您移动到上一页，而不是链接的位置，但它比根本不起作用的链接要好

---

我在这里找到了这个解决方案：

如果你像我一样，转换一个现有的网站，你现在不想浏览每个页面。您可以向标题中添加一行代码，所有标题和所有现有的内部锚链接都将添加数据ajax=“false”标记

当然，这假设您已经在头中包含了自己的javascript文件。如果你不是，你将不得不触摸每一页。但我有一个单独的javascript文件，它已经包含在每个页面中，所以我添加了这一行

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

这将放在$（document）.ready（）块中。如果你还没有那个街区，这里是整个街区

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

希望这有帮助。这与user700284提供的解决方案相同，但是以自动方式提供的。

谢谢 这个解决方案对我有效

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

$（文档）.ready（函数（）{
$（“a”）。每个（函数（）{
if（this.href.indexOf（“index.php”）>=0）（this.attr（“data ajax”，false）；
});
});

我将

#

替换为

index.php

，这是我的文档根目录。

---

但是，它不适用于表单按钮，即

input type=“submit”

首先，您必须将此代码放入一个自定义的.js文件中

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

---

然后在加载jquery mobile js之前将此文件添加到您的网页中。因为

'mobilinit'

事件会立即触发

如果页面是从另一个页面加载的ajax（在JQuery mobile中通常是这样），那么请确保将代码添加到数据role=“page”元素的末尾。我想您的意思是将其放在链接标签上（与锚定标签相反）？在同一jquery移动应用程序中链接到外部页面（而不是链接）时，这也很有用，我的意思是，您有一个从

index.html

指向

create.html#creates

的链接。它有时作为JQM命令工作，但有时不能，因此

dataajax=“false”

atribute是一个很好的解决方案。

// On page load on mobiles only, look for the specific a tag you want to take control over,
// alternatively you can still target all 'a' tags
        $('a[href*="#component"]').each(function () {
            // then set data-ajax to false, 
            $(this).attr("data-ajax", false);
            // at this point you can add the class to your target a tags. 
            // You can do it elsewhere but because for this example my 
            // 'a' tags are automatically generated so I just add the class here
            $(this).addClass('in-pagelink');
            // then target the class and bind to a click event 
            $('a.in-pagelink').bind('click', function (ev) {
                // here I redirect the page with window.location.assign
                // as opposed to window.location.href. I find that it works better
                window.location.assign(this.href);
                // then I close my navigation menu
                closeAll();
            });

        });

// On page load on mobiles only, look for the specific a tag you want to take control over,
// alternatively you can still target all 'a' tags
        $('a[href*="#component"]').each(function () {
            // then set data-ajax to false, 
            $(this).attr("data-ajax", false);
            // at this point you can add the class to your target a tags. 
            // You can do it elsewhere but because for this example my 
            // 'a' tags are automatically generated so I just add the class here
            $(this).addClass('in-pagelink');
            // then target the class and bind to a click event 
            $('a.in-pagelink').bind('click', function (ev) {
                // here I redirect the page with window.location.assign
                // as opposed to window.location.href. I find that it works better
                window.location.assign(this.href);
                // then I close my navigation menu
                closeAll();
            });

        });