如何使用jQuery过滤数据列表?

时间:2018-07-20 15:43:42

标签: javascript jquery datalist

我有一个数据列表,它有2列,上面充斥着礼物和积分。

当我比较用户的积分和礼物的积分时,我的数据列表中不应该看到的礼物的位置为空。

那是切换js:

var parts = window.location.href.split('x')[1][5];

if (parts == "k") {
  $("#chOdul").prop('checked', !($('#chOdul').is(':checked')));
  var mus_puan_val = parseFloat($("[id*='lblMusPuan']").text());
  var b = "";
  $(".element").each(function(index) {
    b = this.attributes["data-id"].value;
    $("#" + b).show();
    var element_value = parseFloat($(this).text());
    if (element_value <= mus_puan_val) {
      $("#" + b).show();
    } else {
      $("#" + b).hide();
    }
  });
}

我的数据列表:

<asp:DataList ID="DataList1" RepeatColumns="2" RepeatDirection="Horizontal" runat="server" OnItemDataBound="DataList1_ItemDataBound">
  <ItemTemplate>
    <div class="row" style="margin-bottom: 0 !important">
      <div class="col s12 m12 l12">
        <div class="col s12 m6 l6">
          <div class="genel" id='odl<%#Eval("OdulID") %>'>
            <a onclick='odulAyrinti(<%#Eval("OdulID") %>,"<%#Eval("Ad") %>","<%#Eval("Miktar") %>","<%#Eval("Puan") %>",  "<%#Eval("Aciklama").ToString().Replace("\"","")%>");return false;'>
              <div class="card" style="margin: 0 !important">
                <div class="card-image">
                  <asp:Image Style="height: 120px;" ID="Image1" runat="server" />
                </div>
                <div class="card-content" style="height:150px !important">
                  <div style="height:50%">
                    <p style="font-family: 'Roboto', sans-serif; font-size: 17px;color:#343434;text-decoration-line:underline;">
                      <%#Eval("Ad") %>
                    </p>
                  </div>
                  <div class="hizala" style="margin-top:20% !important">
                    <p style="font-size: 16px; font-weight: 400; float: left" class="dilKontrol" dil_text="stok"></p>
                    <p style="font-size: 16px">
                      <%#Eval("Miktar") %>
                    </p>
                    <label id="lblOdulPuan" style="font-size: 18px; font-weight: 500; color: #ff0000;float:left" class="dilKontrol" dil_text="puan"></label>
                    <div class="element" data-id='odl<%# Eval("OdulID")%>'>

                      <p style="float: left; font-size: 18px; font-weight: 500; padding-right: 3px; color: #ff0000;">
                        <%#Eval("Puan","{0:###.#0,##}") %>
                      </p>
                    </div>
                  </div>
                </div>
                <div id="lblOdulBilgisi" runat="server" hidden="hidden">
                  <p>
                    <%#Eval("Aciklama") %>
                  </p>
                </div>
              </div>
            </a>
          </div>
        </div>
      </div>

如何清除数据列表的空白区域?

它看起来像这样:

enter image description here

0 个答案:

没有答案