Question

我试图只显示满足条件的行，但我似乎用我当前的解决方案隐藏了所有内容。有没有人知道这里可能出现的问题，以及如何解决？

var rangeOne = "col2.alpha";

$("button.priceRangeOne").click(function(){  
    if ($(rangeOne < 500)) {
       $("tr").css("display","none");
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<button class="priceRangeOne">$0-$499</button>

<table>
    <tr class="row1 tv">
        <td class="col1 alpha">Samsung</td>
        <td class="col2 alpha">$499</td>
    </tr>
    <tr class="row2 tv">
        <td class="col1 alpha">Vizio</td>
        <td class="col2 alpha">$500</td>
    </tr>
</table>

Answer 1

试试这个：你可以找到所有td with class =“alpha”，然后迭代它们来比较它的数量。

var rangeOne = "alpha";
$("button.priceRangeOne").click(function(){
    //find all alpha tds  
    $("."+rangeOne).each(function(){
       // remove $ sign
       var amount = $(this).html().replace('$','');
       //check if it is amount and compare it
       if(!isNaN(amount) && parseInt(amount) < 500)
         $(this).closest('tr').hide();
    });

});

<强> JSFiddle DEMO

用Jquery按价格显示表格

1 个答案: