如何在 jQuery Mobile 1.4.5 中获取当前页面 URL?

Posted

技术标签:

【中文标题】如何在 jQuery Mobile 1.4.5 中获取当前页面 URL?【英文标题】:How do you get the current page URL in jQuery Mobile 1.4.5? 【发布时间】:2017-08-23 08:04:24 【问题描述】:

请不要将此标记为重复。我已经尝试了 *** 上建议的所有方法,但没有一个有效。他们都给了我引用页面的 URL,而不是当前页面。或者他们根本不工作。甚至 window.location.href 返回引用页面 URL,而不是当前页面 URL。我正在使用 jQuery Mobile 1.4.5。

例如,假设我在 page1.php 上并单击了指向 page1.php?getvar=42 的链接。第 1 页如下所示:

<!doctype html>
<html>
<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>
</head>
<body><div data-role="page" data-dom-cache="false">
<a href="page1.php?getvar=42">Click Here</a>
<?php if ($_GET['getvar']=='42'): ?>
<script>
console.log(window.location.href);
console.log(document.location.href);
console.log($.mobile.activePage.data('url'));
</script>
<?php endif ?>
</div></body></html>

当我单击上面页面中的链接并查看控制台中显示的内容时。我明白了:

http://hostname/page1.php
http://hostname/page1.php
/page1.php

我还尝试将这些对 console.log() 的调用包装在 jQuery $(document).ready() 函数中,结果没有变化。

<script>
$(function() 
    console.log(window.location.href);
    console.log(document.location.href);
    console.log($.mobile.activePage.data('url'));
);
</script>

如您所见,这些都不是完整的 URL。链接到不同的文件时也是如此。因此,它不仅会影响 URL 上带有 GET 变量的页面。我期待看到 /page1.php?getvar=42

我在 Stack Overflow 上找到了提出同样问题的主题,但没有一个答案对我有用。也许他们正在使用不同版本的 jQuery Mobile。如您所见,我使用的是 jQuery 1.4.5。

到目前为止,我发现的唯一解决方案是通过将 data-ajax="false" 放在父容器上来关闭 jQuery mobile 中页面的 ajax 加载。但一定有更好的办法。

(顺便说一句,我需要这个的原因是为了重新加载当前页面。但目前所有重新加载当前页面的尝试都只会让我回到引用页面。这就是原因。)

【问题讨论】:

这将对您有所帮助 ***.com/questions/901115/… 。您要查找的内容称为查询字符串。 查询字符串未显示在 URL 中。这就是问题所在。 好吧,那你就无法得到不存在的东西 :) 你特别说这个“例如说我在 page1.php 上,我点击了一个指向 page1.php 的链接?getvar=42” 我的观点完全正确。为了清楚起见,我说的是单击指向 page1.php?getvar=42 的链接,然后检查当前位置并获取 page1.php,即使我在 page1.php?getvar=42 上。这是 jQuery Mobile 使用 ajax 将链接页面加载到 DOM 的工件。 【参考方案1】:

试试下面的功能。我在我的项目中使用了这种平静的代码,它做得很好。

  var getUrlParameter = function getUrlParameter(sParam) 
    var sPageURL = decodeURIComponent(window.location.search.substring(1)),
        sURLVariables = sPageURL.split('&'),
        sParameterName,
        i;
    for (i = 0; i < sURLVariables.length; i++) 
        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) 
            return sParameterName[1] === undefined ? true : sParameterName[1];
        
    
  ;

【讨论】:

【参考方案2】:

答案是将 window.location.href 包装在 setTimeout() 调用中,如下所示:

<script>
setTimeout(function() 
    console.log(window.location.href);
, 0);
</script>

不过,在 $(document).ready() 调用中进行包装是行不通的。

【讨论】:

api.jquerymobile.com/jQuery.mobile.path.parseUrl 你不需要使用 setTimeoit 也不需要准备好。使用页面容器事件。 ***.com/a/26393037/1771795

以上是关于如何在 jQuery Mobile 1.4.5 中获取当前页面 URL?的主要内容,如果未能解决你的问题,请参考以下文章

如何将“slideup()”和“slidedown()”函数应用于可折叠的 Jquery Mobile 1.4.5?小提琴手

如何在 Jquery Mobile 选择选项中更改突出显示颜色

如何修复 jQuery mobile 子菜单中的标题

jquery mobile更改复选框颜色

在多个页面上打开相同的弹出对话框 Jquery Mobile 1.4.5

JQuery Mobile 1.4.5 右面板动画