Question

您好，我只想在值不超过25时显示按钮。我的代码如下所示。我的产品列表元素中的值为25。每单击一次，我就在input[name='skip]元素中添加6。我做错了什么？请注意，我的input[name='skip]每次点击都在增加。

$(function () {
    $("#button-submit").click(function () {
        var $productList = $(".product-list");
        var $value = $("input[name='skip']");
        $value.val(parseInt($value.val()) + 6);
        if (parseInt($productList.val()) >= parseInt($value.val())) {
            $("#button-submit").hide();
        }
    });
});

Answer 1

选择器似乎有错误

var $productList = $(".product-list']");

应该类似于

var $productList = $(".product-list");

编辑：我认为您可能想使用

$(".product-list").length而不是$(".product-list").val()，因为它看起来像是项目的集合。

您还没有提供完整的标记，只是一个猜测。

Answer 2

您的条件不正确。因此，您应该使用<而不是>=

$("#button-submit").click(function () {
  var $productList = $(".product-list");
  var $value = $("input[name='skip']");
  $value.val(parseInt($value.val()) + 6);
  if (parseInt($productList.val()) < parseInt($value.val())) {
    $("#button-submit").hide();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="product-list" value="25">
<input type="text" name="skip" value="0">
<button type="button" id="button-submit">Click</button>

您的代码也可能更简单

$("#button-submit").click(function () {
  var $value = $("input[name='skip']");
  $value.val(+$value.val() + 6);
  if (+$(".product-list").val() < +$value.val()) {
    $(this).hide();
  }
});

Answer 3

您是否要获取列表项的数量？我有一个下面的示例用于计数列表项。另外，我注意到productlist与value的比较是“后退”，因此我将运算符“小于”而不是“大于”反转了。

$(function() {
  $("#button-submit").click(function() {
   
    // get number of list items
    var $productList = $('.product-list').children('li').length;
    var $value = $("input[name='skip']");
    //alert("value: "+$value.val());
    //alert("value: "+$value.val()+" productlist: " + $productList);
    $value.val(parseInt($value.val()) + 6);

    if ($productList <= parseInt($value.val())) {
      $("#button-submit").hide();
    }

  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="skip" value=0>
<button id="button-submit">Click</button>
<div class="product-list"></div>

<ul class="product-list">
  <li>Apple</li>
  <li>Banana</li>
  <li>Carrot</li>
  <li>Pear</li>
  <li>Cherry</li>
  <li>Watermelon</li>
  <li>Lemon</li>
  <li>Kiwi</li>
  <li>Grape</li>
</ul>

当值超过特定数量时如何隐藏按钮

3 个答案: