根据jQuery过滤项目

时间:2018-12-03 09:46:51

标签: jquery html

我正在使用java对象从数据库中提取数据并显示应用程序中的产品列表。

这是我列出产品的代码。

jQuery

function getitemlist() {
    var url = serverURL() + "/getcatalogue.php";
    var JSONObject = {
        "subCategoryID": subCategoryID,
        "degreeID": degreeID
    };

    $.ajax({
        url: url,
        type: 'GET',
        data: JSONObject,
        dataType:'json',
        contentType: "application/json; charset=utf-8",
        success: function (arr) {
            _getitemlist(arr);
        },
        error: function () {
            alert("Failed");
        }
    });
}

function _getitemlist(arr) {
    var i;
    $("#itemlist").empty();
    for (i = 0; i < arr.length; i++) {
        var t;
        t = "<a id='btnshowitem" + arr[i].itemID + "'><img src='" + serverURL() + "/images/" + arr[i].itemImage+ "' class='image'> <br>"+ arr[i].itemName + "<br>"+ "Price: $" + arr[i].itemPrice + "</a>"
        $("#itemlist").append(t);
        $('#btnshowitem' + arr[i].itemID).bind("click", { id: arr[i].itemID}, function (event) {
            var data = event.data;
            showitemdetails(data.id);
        });
}

反正有过滤项目吗?例如按价格?

1 个答案:

答案 0 :(得分:0)

您可以使用Array.prototype.filterdocs)。

function _getitemlist(arr) {
  var i;
  var filter = "price";
  var value = 25;

  switch (filter) {
    case "price":
      arr = arr.filter(item => item.itemPrice > value);
      break;
    default:
      break;
  }

  $("#itemlist").empty();

  for (i = 0; i < arr.length; i++) {
    var t;
    t = "<a id='btnshowitem" + arr[i].itemID + "'><img src='" + serverURL() + "/images/" + arr[i].itemImage + "' class='image'> <br>" + arr[i].itemName + "<br>" + "Price: $" + arr[i].itemPrice + "</a>"
    $("#itemlist").append(t);

    $('#btnshowitem' + arr[i].itemID).bind("click", {
      id: arr[i].itemID
    }, function(event) {
      var data = event.data;
      showitemdetails(data.id);
    });
  }
}

在上面的示例中,我设置了Switch以选择将使用的过滤器和一个值。 arr.filter将返回包含价格大于value的所有商品的数组。

我在将项目添加到dom之前做了过滤器,然后在一个函数中可以有多个过滤器。