代码之家 › 专栏 › 技术社区 › Reece

无法使用某些类jquery获取最近的元素

html javascript

Reece · 技术社区 · 8 年前

我有一个函数可以捕捉输入是否已更改,然后如果该值超过最大值,它会将该值设置为最大值。因此,您不能输入超过最大值的值。但是,如果尝试这样做,我希望显示一条错误消息,但我正在努力获取最接近的错误消息。这是我的密码;

$(document).on('keydown keyup', '.quantity input', function(e) {
  var max = Number($(this).attr('max'));

  if ($(this).val() > max) {
    e.preventDefault();
    $(this).val(max);
    $(this).closest('.quant_warn').show();
  } else if ($(this).val() < 1) {
    e.preventDefault();
    $(this).val(1);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="quantity">
  <label>Quantity: </label>

  <div class="increment">
    <span></span><span></span>
  </div>

  <input type="text" value="1" min="1" max="10">

  <div class="decrement">
    <span></span>
  </div>

  <div class="quant_warn" style="display: none;">only 10 in stock</div>
</div>

2 回复 | 直到 8 年前

Zakaria Acharki 8 年前

.quant_warn input siblings()

$(this).siblings('.quant_warn').show();

keydown keyup

$(document).on('input', '.quantity input', function(e) {
  var max = Number($(this).attr('max'));

  if ($(this).val() > max) {
    e.preventDefault();
    $(this).val(max);
    $(this).siblings('.quant_warn').show();
  } else if ($(this).val() < 1) {
    e.preventDefault();
    $(this).val(1);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="quantity">
  <label>Quantity: </label>

  <div class="increment">
    <span></span><span></span>
  </div>

  <input type="text" value="1" min="1" max="10">

  <div class="decrement">
    <span></span>
  </div>

  <div class="quant_warn" style="display: none;">only 10 in stock</div>
</div>

Vishnu Jayan 8 年前

$(document).on('keydown keyup', '.quantity input', function(e) {
    var max = Number($(this).attr('max'));
    var val = parseInt($(this).val());
    if (val) {
      if (val > max) {
        e.preventDefault();
        $(this).val(max);
        $(this).siblings('.quant_warn').show();
      } else {
        $(this).siblings('.quant_warn').hide();
      }
    }
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="quantity">
  <label>Quantity: </label>

  <div class="increment">
    <span></span><span></span>
  </div>

  <input type="text" value="1" min="1" max="10">

  <div class="decrement">
    <span></span>
  </div>

  <div class="quant_warn" style="display: none;">only 10 in stock</div>
</div>

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

1 年前

Alex · 在轻量级中同时解构和不解构变量

1 年前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

bairog · 从按属性筛选的对象数组字典中创建值数组

1 年前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

1 年前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

user3472810 · Angular@Output/EventEmitter返回undefined

1 年前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

1 年前