Question

<input type="checkbox" id="canafford"></input>

我想要它，所以当您选中该复选框时，只会显示您可以购买的升级。这是我的升级代码（它会更长，但我只会向您展示一部分）。

<tr id="up1">
  <td><button onclick="upgrade(2, 1)">Upgrade</button></td>
  <td>2 gold</td>
  <td>x2 Resting speed.</td>
</tr>

他们每个人都有id up1 up2 up3等等。我所需要的只是如果黄金（货币）低于它隐藏的价格。价格是所有这些中的第二个;在这种情况下，它是2金。

Answer 1

您可以通过几种可能的方式完成此操作。这是一种有效的解决方案。

请检查此代码段并随时编辑变量“goldAvailable＆＃39;”。我实际上在每次点击这个复选框时循环遍历所有tr元素。如果它被检查然后我从第二个td项目中取值并将其解析为整数，这样我就可以将它与可用的钱进行比较。那些高于可用的东西将被隐藏。在取消选中框时，一切都会显示：阻止

＆＃13;

var goldAvailable = 3;

$('#canafford').on('click', function(){ 
    if($('#canafford:checkbox:checked').length > 0) {
        $('tr td:nth-child(2)').each(function () {
            var gold = $(this).html();
            gold= parseInt(gold.substring(0,gold.length-4));
            if(gold>goldAvailable) {
                $(this).closest('tr').css('display','none');
            }
        });
    } else {
            $('tr td:nth-child(2)').each(function () {
                $(this).closest('tr').css('display','block');
            });
    }
    
});

＆＃13;

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
    <input type="checkbox" id="canafford"> </input>
    <table>
    <tr id="up1">
        <td><button onclick="upgrade(2, 1)">Upgrade</button></td>
        <td>2 gold</td>
        <td>x2 Resting speed.</td>
    </tr>
    <tr id="up1">
        <td><button onclick="upgrade(2, 1)">Upgrade</button></td>
        <td>3 gold</td>
        <td>x2 Resting speed.</td>
    </tr>
    <tr id="up1">
        <td><button onclick="upgrade(2, 1)">Upgrade</button></td>
        <td>4 gold</td>
        <td>x2 Resting speed.</td>
    </tr>
    <tr id="up1">
        <td><button onclick="upgrade(2, 1)">Upgrade</button></td>
        <td>5 gold</td>
        <td>x2 Resting speed.</td>
    </tr>
    </table>
</body>

</html>

＆＃13;

Answer 2

<tr id="up1" data-price="2">
    <td><button onclick="upgrade(2, 1)">Upgrade</button></td>
    <td>2 gold</td>
    <td>x2 Resting speed.</td>
</tr>

和javascript：

$(function() {
    $('#canafford').change(function() {
        if($(this).is(":checked")) {
            $('tr').each(function() {
                if ($(this).data('price') > myMoney) {
                    $(this).hide();
                }
            });
        } else {
            $('tr').show();
        }
    }
}

JQuery隐藏的元素比表中的变量大

2 个答案: