将 href 链接到其他页面选择的下拉选项值

Question

这是一个问题，谷歌似乎没有答案。 我有 2 页：page-1 和 page-2。

page-2 有一个元素和切换按钮框，代码如下：

 <ul>
<li><button class="button is-checked" data-filter="*">All</button></li>
<li><button class="button" data-filter=".a1">a1</button></li>
<li><button class="button" data-filter=".b1">b1</button></li>
<li><button class="button" data-filter=".c1">c1</button></li>
<li><button class="button" data-filter=".d1">d1</button></li>
</ul>

选择代码：

<select class="form-control filters-select" style="border-radius:0">
<option value="*">All</option> 
<option value=".a2">a2</option>
<option value=".b2">b2</option>
<option value=".c2">c2</option>
</select>

以上2个元素都在page-2中，使用jQuery isotope过滤数据。 现在，如果我必须在 page-1 中使用 href 来链接到 page-2，以便单击它会打开 page-2，并带有选定的选项或选中的按钮。

怎么做？

里面的代码是什么：

<a href""> 

感谢吨

Answer 1

您不能仅使用 href 链接来做到这一点。但是，您可以放置​​如下链接：

使用 javascript

<a href="page2.php#selectAll"> 

并在 onload 函数中使用 javascript 捕获查询：

var whatToDo = window.location.hash.substr(1);
//depending of whatToDo is, select something.

---

使用 PHP

<a href="page2.php?select=All">

并在您的 php 中捕获 GET 变量以选择某些内容。

<select class="form-control filters-select" style="border-radius:0">
<option value="*" <?php if ($_GET['select']=="All") echo "selected" ?>>All</option> 
<option value=".a2">a2</option>
<option value=".b2">b2</option>
<option value=".c2">c2</option>
</select>

Answer 2

这是未经测试的，但应该可以帮助您入门。使用 URL 参数，您可以将数据从第 1 页发送到第 2 页，这也可以在 PHP 中完成。

第 1 页：

<a href="page2.html?button=a1&select=a1">Page 2</a>

第 2 页：

$( document ).ready(function() {
    var vars = {};
    window.location.href.replace( 
        /[?&]+([^=&]+)=?([^&]*)?/gi, // regexp
        function( m, key, value ) { // callback
            vars[key] = value !== undefined ? value : '';
        }
    );

    $('[data-filter="'+ vars['button'] +'"]').addClass('is-checked');
    $('select > [value="'+ vars['select'] +'"]').attr('selected');
});

Answer 3

谢谢大家。我终于解决了。它是通过使用 - jQuery isotope hash history / URL hash 完成的。