按评级过滤下拉菜单
按评级过滤下拉菜单
提问于 2019-03-07 09:34:27
我希望我能正确解释这一点。我正在构建一个书签应用程序，在那里用户可以存储到他们最喜欢的网站的链接，并给他们1-5星评级。有一个下拉菜单，用户可以选择只显示具有4星级及以上，3星级及以上等的书签。我知道我必须做一些条件或不等式语句，但是我不知道如何说“当我点击那个特定的选项时，我想过滤我的书签数组，并在我的页面上显示过滤后的项目。”我的问题不是过滤部分，而是如何实际定位下拉菜单中的选项。我正在尝试使用jQuery完成这项工作
下拉菜单的HTML：
<div class="filter-menu">
<select id="dropdown" name="rating">
<option disabled value></option>Filter by rating:</option>
<option value=5>5 stars</option>
<option value=4>4 stars & above</option>
<option value=3>3 stars & above</option>
<option value=2>2 stars & above</option>
<option value=1>1 star & above</option>
</select>
</div>JS：
function handleRatingFilter(value){
$('.filter-menu').on('click', '#dropdown', event => {
event.preventDefault();
console.log('dropdown menu option clicked!');
if (value === 1){
const bookmarks = STORE.list.filter(bookmark => bookmark.rating >= 1);
return bookmarks;
}
renderStore();
});
}很明显，我的函数不起作用，我可能完全走错了路，但这是我的出发点和逻辑。
Stack Overflow用户
发布于 2019-03-07 09:41:09
$(document).ready(function() {
$('.filter-menu').on('click', '#dropdown', event => {
event.preventDefault();
console.log('dropdown menu option clicked!');
var value = $(this).val(); // Here to get value
if (value === 1){
const bookmarks = STORE.list.filter(bookmark => bookmark.rating >= 1);
return bookmarks;
}
renderStore();
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55034728
复制相关文章
相似问题
腾讯云开发者
