按名称、价格过滤 JQuery 列表... json 数组，JQuery.grep()答案

【问题标题】：Filter JQuery list by name, price... json array, JQuery.grep()按名称、价格过滤 JQuery 列表... json 数组，JQuery.grep()
【发布时间】：2026-01-14 12:00:01
【问题描述】：

我刚刚收到了关于我之前的问题的惊人反馈，但现在我又陷入了困境。

我有一个显示我的 json 数组的 JQuery 列表视图。它工作正常。但现在，我希望能够按名称或价格过滤我的结果。我查找了 jQuery.grep() 方法，但无法真正让它正常工作。

如果有人能给我一些关于如何让它工作的指示，我们将再次不胜感激。

这是我到目前为止的代码：

js 文件：

 // Json 数组
    var productList = {“产品”：[
        {“描述”：“产品 1”，“价格”：“9.99 美元”}，
        {“描述”：“产品 2”，“价格”：“9.97 美元”}，
        {“描述”：“产品 3”，“价格”：“8.52 美元”}，
        {“描述”：“产品 4”，“价格”：“5.24 美元”}，
        {“描述”：“产品 5”，“价格”：“4.21 美元”}
    ]
    };

function loadList() {

//  var list = document.getElementById('productList');
    var list = $("#productList").listview();
    list.sort();

   $(productList.products).each(function(index){
    $(list).append('<li id="listitem">' + this.description + "  " +
            "    :     " +  this.price + '</li>');

   });

   $(list).listview("refresh");

}<code>


HTML 文件：

<html>
<head>
    <title>Product List</title>
    &meta;
    <script src="@=site.cfg.resources.url@/test.js"></script>


</head>

<body onLoad="loadList()">


<div data-role="page">

    <div data-role="header" id="header">
        <h1>Product List</h1>
    </div>


    <div data-role="content" id="content">
        <ul id="productList" data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
        </ul>
    </div>



</div>



</body>
</html>

【问题讨论】：

标签： javascript jquery html json

【解决方案1】：

.filter() 应该做你正在寻找的，我认为。

【讨论】：

取决于您想要过滤的内容。只需让您传递的函数返回您要保留的元素的 true ，否则返回 false 。另外，如果我理解您的操作正确，我会在 $(productList.products) 上调用过滤器。
感谢您的帮助，但我不确定我是否完全明白。我对 Web 开发还很陌生，对很多事情仍然不确定。我会尝试解决这个问题，我会检查 .filter 方法。谢谢！
例如，$(productList.products).filter(function () { return parseFloat(this.price)
工作！感谢您的帮助，不胜感激。我将对其进行更多研究，以便能够按名称和其他过滤器对其进行排序。干杯！

【解决方案2】：

$.grep()

值得一试。

【讨论】：