Javascript从链接获取参数

Question

html代码function getQuerystring() {  var getUrlParameter = function getUrlParameter(sParam) {    var sPageURL = 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 : decodeURIComponent(sParameterName[1]);      }    }  };  var blog = getUrlParameter('c');  document.getElementById('detail').innerHTML = blog;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div style="border: dashed; size: auto;"><a name="divtest" href="#detail?c=active" id="test" onclick="getQuerystring()">testing</a></div><div id="detail" style="border: 2px; size: auto;"></div>这个函数应该在链接中显示 c 的值，但它在 div 中显示 undefined。我已经搜索了很多并尝试了很多东西，但似乎没有任何效果。请指导我正确的代码，我将不胜感激。

Answer 1

从链接获取参数

您的代码使用

var sPageURL = window.location.search.substring(1)

这不是“来自链接”，因此需要更改。正如您已标记 jquery（尽管没有任何 jquery），这是一种可能的解决方案：

$("#test").click(function() {

  getQuerystring(this);

  return false;

});

function getQuerystring(el) {

  console.log(el.href);

  var getUrlParameter = function(sParam) {

    var sPageURL = el.href.split('?')[1],

      sURLVariables = sPageURL.split('&'),

      sParameterName;

      

    for (var i = 0; i < sURLVariables.length; i++) {

      sParameterName = sURLVariables[i].split('=');

      if (sParameterName[0] === sParam) {

        return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);

      }

    }

  };

  var blog = getUrlParameter('c');

  document.getElementById('detail').innerHTML = blog;

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div style="border: dashed; size: auto;">

  <a name="divtest" href="#detail?c=active" id="test">testing</a>

</div>

<div id="detail" style="border: 2px; size: auto;"></div>

Answer 2

window.location.search 将要：

• 为您提供来自当前页面 URL 的数据，而不是链接到的页面

• 为您提供查询字符串中的数据（以?片段开头并一直持续到片段的开头），而不是片段（以片段开头#并一直持续到结尾......即使片段包含 a ?）

您需要refToTheAnchor.search在属性中使用并修复查询和片段的顺序。

Answer 3

您可以尝试使用使用 RegEx 查找查询参数的此函数。将参数名称传递给它以返回值。

//to get query parameters.

$.urlParam = function (name) {

    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec($(location).attr('href'));

    return (results) ? results[1] : "";

}

然后你可以在你的代码中调用这个方法，如下所示。

var paramValue = $.urlParam('paramName');

如果您不想使用 location.href 值，可以修改该方法以传递任何 url。