Javascript 如何使用最小值和最大值属性添加和减去输入值。滑动分页

我正在创建一个表单，在这里，用户可以对输入字段的值进行加减，以显示多个子项

当然，我可以对屏幕上显示的数字进行加减，但当我签入控制台时，实际值保持在0。对我来说，能够检查这个值是很重要的，这样我就可以设置最小值和最大值

如何确保单击按钮时值发生更改

JS:

childVal=$（'#pageSearch children'）.val（）；
minValueChild=$（“#页面搜索子项”）.attr（'min'）；
maxValueChild=$（“#页面搜索子项”）.attr（'max'）；
if（childValminValueChild）{
$（'.sub'）。单击（函数（）{
$（'#pageSearch children'）.val（函数（i，oldval）{
return--oldval；
});
$（'#pageSearch children'）.val（）-1；
});
}

HTML:

---

我建议您将代码更改为以下内容，以便更好地工作：

childVal = $('#pageSearch-children').val();
minValueChild = $('#pageSearch-children').attr('min');
maxValueChild = $('#pageSearch-children').attr('max');
$('.add').click(function() {
  if (childVal < maxValueChild) {
    $('#pageSearch-children').val(function(i, oldval) {
      return ++oldval;
    });
    childVal = $('#pageSearch-children').val();
  }
});
$('.sub').click(function() {
  if (childVal > minValueChild) {
    $('#pageSearch-children').val(function(i, oldval) {
      return --oldval;
    });
    childVal = $('#pageSearch-children').val();
  }
});

儿童
附属的
添加

创建一个JSFIDLE，这样我们就知道您想做什么了do@Grasper好了，谢谢你，伙计！if语句需要在“click”函数中，而不是相反。现在，当页面第一次创建时，它只对那些if语句求值一次。因此，最多只能添加1个按钮单击处理程序。@DicedMango没问题，很乐意帮助我尝试做同样的事情，但同时添加两个字段，如果两者都超过最大值，则按钮将被禁用。。我在fiddlejs中添加了。。如果您能帮忙，我将非常感激：

<h3 class="white black">
    <input class="backgroundNoneInput" type="number" value="0" id="pageSearch-children" name="children" min="0" max="{{ $property--property_sleeps or '99' }}"> 
</h3>
<button type="button" class="sub backgourndNoneButt">
    <span class="white fa fa-minus fa-2x faPlusMin" aria-hidden="true">                      
    </span>
</button>
<button type="button" class="add backgourndNoneButt">
    <span class="white fa fa-plus fa-2x faPlusMin" aria-hidden="true">                        
    </span>
</button>

childVal = $('#pageSearch-children').val();
minValueChild = $('#pageSearch-children').attr('min');
maxValueChild = $('#pageSearch-children').attr('max');
$('.add').click(function() {
  if (childVal < maxValueChild) {
    $('#pageSearch-children').val(function(i, oldval) {
      return ++oldval;
    });
    childVal = $('#pageSearch-children').val();
  }
});
$('.sub').click(function() {
  if (childVal > minValueChild) {
    $('#pageSearch-children').val(function(i, oldval) {
      return --oldval;
    });
    childVal = $('#pageSearch-children').val();
  }
});