Javascript jQuery调用带有触发器的更改事件只触发一次

我正在开发一个使用更改功能的下拉过滤器

现在，当我通过直接更改所选选项来尝试此筛选器时，它可以正常工作，但当我尝试使用URL参数更改所选值时，display属性（在filter函数中动态更改）只有对找到的第一个项目以及具有正确筛选值的所有其他项目所做的更改不会将其属性设置为block

这是我使用的过滤函数：

$(document).ready(function() {
    $('.customFilter select').change(function(e) {
        e.preventDefault();
        var filterValue = $('#myDropdown').val();

        var filterSelector = '#container .filter-item' + '.' + filterValue);

        $('#jpagescontainer .photo-item').css('display','none');
        $(filterSelector).css('display','block');
    });
});

下面是我用URL参数更改所选值的函数：

$(document).ready(function() {
    var cat = getUrlParameter('category');

    $('#myDropdown option[value=' + cat + ']').attr("selected", "selected");
    $('#myDropdown option[value=' + cat + ']').trigger('change');
});

对于两个调用，这两个筛选器变量保持不变

我的HTML看起来像这样：

<div class="customFilter">
    <select id="myDropdown" class="filter">
        <option value="" selected="selected">Show all</option>
        <option value="opt1">Option1</option>
        <option value="opt2">Option2</option>
    </select>
</div>

<div id="container">
    <div class="filter-item opt1">
        <p>Some Text 1</p>
    </div>
    <div class="filter-item opt2">
        <p>Some Text 2</p>
    </div>
</div>

全部展示
选择1
选择2
一些文本1

一些文本2

URL函数有什么问题吗，或者我遗漏了什么

编辑：

---

多亏了马克·拜恩斯的帮助，我基本上明白了。。。这个问题是由另外一个脚本造成的，该脚本将显示的项目限制为20个，碰巧前20个项目中只有一个与筛选类别匹配。

您的问题有点不清楚。您的代码存在一些错误。我想这就是你想要的。我转义了

getUrlParameter

函数，因为它在代码段中不起作用。我将其替换为

opt1

的值，以模拟url函数值

$（文档）.ready（函数（）{
$（'.customFilter select'）.change（函数（e）{
e、 预防默认值（）；
var filterValue=$（'#myDropdown'）.val（）；
如果（filterValue==''）{
var filterSelector='#container.filter item'；
}
否则{
var filterSelector='#container.'+filterValue；
}
$（'#container.filter item'）.hide（）；
$（filterSelector.show（）；
});
var cat='opt1'；//getUrlParameter（'category'）；
$（'#myDropdown'）.val（cat）；
$（“#myDropdown”）.trigger（'change'）；
});
。筛选项{
显示：无；
}

全部展示
选择1
选择2
一些文本1

一些文本2

一些文本3

函数在哪里
getUrlParameter（）
？尝试在选择框中调用更改事件。option元素不是正在更改的元素。
getUrlParameter（）
函数是预先实现的，可以正常工作。url类别中可以有多个值吗？你能显示你的url是什么样子吗？url是这样的：site.com/filterpage？category=opt1是的，如果url中的值是
opt1
，它将只显示opt1 div。你不想这样吗？请详细描述一下您期望的结果。我会尽量说得更具体一点：如果您看这把小提琴：您可以看到，在选择选项1时，它会显示两个div。但在我的例子中，当我尝试使用上述url参数时，它只会显示第一个div，尽管第二个div也有值=opt1，但当我模仿代码片段中的
opt1
值时，它似乎工作正常。你能试试
console.log（getUrlParameter（'category'）
并查看函数返回的值是什么？