如何使用jquery设置加减值min=0和max=10

Question

如何使用自定义按钮设置加减输入值，规则min=0和max=10，这几乎类似于<input type="number" value="0" min="0" max="10" />，这里是我的代码示例，我创建了按钮加减来用jquery更改输入值，但该值没有最小和最大规则，我该怎么创建它？

$(function(){
var x = $('input').val();

$('#plus').click(function(){
$('input').val(++x)
});

$('#minus').click(function(){
$('input').val(--x)
});
});

.n{display:flex}
input{margin:0 8px 0 8px}
.b{
padding: 4px;
background: yellow;
cursor: pointer;
}
.b:hover{
background: blue;
color: white;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>Quantity</p>
<div class="n">
<div id="minus" class="b">
minus
</div>
<input type="text" value='0'>
<div id="plus" class="b">
plus
</div>
</div>

Answer 1

$(function(){
var x = $('input').val();

$('#plus').click(function(){
$('input').val(x<10?++x:x)
});

$('#minus').click(function(){
$('input').val(x>0?--x:x)
});
});

.n{display:flex}
input{margin:0 8px 0 8px}
.b{
padding: 4px;
background: yellow;
cursor: pointer;
}
.b:hover{
background: blue;
color: white;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>Quantity</p>
<div class="n">
<div id="minus" class="b">
minus
</div>
<input type="text" value='0'>
<div id="plus" class="b">
plus
</div>
</div>