Question

jQuery / JS新手...... Stackoverflow上的一些帖子很有用，但是一旦get.URL函数运行，我就无法触发更改功能。

我正在尝试创建一个带有下拉过滤器的简单页面。我还希望此下拉菜单能够根据URL watch = Cat1

中的值预先选择一个选项

以下是选择的代码：

<select name="watch" id="watch">
<option value="All">All news</option>
<option value="Cat1">Category 1</option>
<option value="Cat2">Category 2</option>
<option value="Cat3">Category 3</option>

以下是我的脚本：

<script>
  //Filter News
  $('select#watch').change(function() {
    var filter = $(this).val()
    filterList(filter);
  });

  //News filter function
  function filterList(value) {
    var list = $(".news-list .news-item");
    $(list).fadeOut("fast");
    if (value == "All") {
      $(".news-list").find("article").each(function(i) {
        $(this).delay(200).slideDown("fast");
      });
    } else {
      //Notice this *=" <- This means that if the data-category contains multiple options, it will find them
      //Ex: data-category="Cat1, Cat2"
      $(".news-list").find("article[data-category*=" + value + "]").each(function(i) {
        $(this).delay(200).slideDown("fast");
      });
    }
  }

</script>
<script>
     function getURLParameter(name) {
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null
}
var val = getURLParameter('watch');
$('#watch').val(val);   //  assign URL param to select field
    ('select#watch').trigger("change");}
    </script>

我可以根据URL参数选择正确的选项，但是，选择框不再根据选择更新页面。

提前谢谢你， UDI

根据URL中的参数预选选项

0 个答案: