单击另一个页面上的链接时的Javascript传递参数

Question

我在我的网站上实现了一个滑块，并希望在单击另一个页面上的链接时到达特定值：

这是我要更改的脚本和参数：

$("#screeningSlider").ionRangeSlider({
    hide_min_max: true,
    keyboard: true,
    from: 20,
    min: 1,
    max: 2000,
    step: 0,
    grid_num: 4,
    prettify_separator: ",",
    postfix: " Units",
    max_postfix: "+",
    force_edges: true,

});

所以当在另一个页面上时，我想点击一个按钮，让我登陆这个页面，但是参数 FROM 是 10 而不是上面的默认值。这只应在从该特定按钮中选择时发生。

这是我的带有滑块的网站：http://therrd.com/screening.html#tenant-Screening

Answer 1

如果不以其他形式存储 JavaScript 值，然后将其解析回 JavaScript，则实际上不可能在页面之间共享 JavaScript 值。

您可以使用 URL 参数，然后解析传入的 URL 并从那里导入默认的 from 值。

<a href='http://www.yoursite/?from=10'>Referral </a>

这样做的缺点是，很明显，任何人都可以偷看您的 URL，然后尝试玩弄您的系统（想想如果他们将其设置为 ?from=0 而您没有防范会发生什么）。您还需要防范注入攻击。

您可以在他们单击特定按钮后使用localStorage 设置键，然后在加载主页时检查localStorage 中的该键以获得预期的默认from 值。

为特殊链接设置点击值：

$('#link').on('click', function(){
  localStorage.setItem('fromValue', 10);
});

并在加载时为结果页面检索它：

var fromValue = localStorage.getItem('fromValue')
if (fromValue) { /* adjust the slider's default from value*/ }

Answer 2

如果你不想使用服务器端，你可以这样做

[已编辑]

1 - 设置链接

<a href="yourpage.html?slide=10">Go</a>

2 - 在 yourpage.html 中设置函数

  vals = {max: 100, min: 0, def: 20} //use your own values here for max min and def
  var param = window.location.href.split("slide=");
  slide = isNaN(param[param.length - 1]) || 
          param[param.length - 1] > vals.max ||
          param[param.length - 1] < vals.min ? vals.def : param[param.length - 1];
          //check if there is a url param, if it's a number and if it's in range      

  $("#screeningSlider").ionRangeSlider({
        hide_min_max: true,
        keyboard: true,
        from: slide,
        min: 1,
        max: 2000,
        step: 0,
        grid_num: 4,
        prettify_separator: ",",
        postfix: " Units",
        max_postfix: "+",
        force_edges: true,

  });