需要帮助添加最大值和最小值来对抗
Need help adding max and min value to counter
我正在尝试制作一个从 0 开始到 12 结束的计数器我现在拥有的是一个我无法设置上限的计数器。所以基本上,我无法设置最大值和最小值。这是我的代码:
<div class="counter8">
<label id="blank"></label>
<div class="operations">
<a href="javascript:void(0)" onclick="dec_num8()" class="dec opr8">⇦</a>
<span class="count8">0</span>
<a href="javascript:void(0)" onclick="inc_num8()" class="inc opr8">⇨</a>
</div>
</div>
<script>
var add=document.querySelector(".inc");
var sub=document.querySelector(".dec");
let counter8=document.querySelector(".count8");
function inc_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
counter8.innerText=temp8+1;
if (temp8 > 12) {
counter8.value = 12;
} else {
counter8.value = temp8;
}
}
function dec_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
counter8.innerText=temp8-1;
}
</script>
增加按钮是我的尝试之一,但失败了。
您可以使用 Math.max and Math.min 来限制值。
<div class="counter8">
<label id="blank"></label>
<div class="operations">
<a href="javascript:void(0)" onclick="dec_num8()" class="dec opr8">⇦</a>
<span class="count8">0</span>
<a href="javascript:void(0)" onclick="inc_num8()" class="inc opr8">⇨</a>
</div>
</div>
<script>
var add=document.querySelector(".inc");
var sub=document.querySelector(".dec");
let counter8=document.querySelector(".count8");
function inc_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
counter8.innerText=Math.min(12,temp8+1);
}
function dec_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
counter8.innerText=Math.max(0,temp8-1);
}
</script>
如果您想使用 if 分支修复代码,您可以这样做:
if (temp8 >= 12) {
temp8 = 12;
} else {
temp8++;
}
counter8.innerText=temp8;
或在一行中:temp8 = temp8 >= 12 ? temp8 : temp8+1
对于最小的一个只是翻转版本
您并没有真正限制减号按钮上的最小计数器。而且你只有在检查条件后才增加它。
所以给你举个例子:
function inc_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
if (temp8 >= 12) { // here changed to >=
counter8.innerText = 12; //also use innerText, not value
} else {
counter8.innerText=temp8+1;
}
}
function dec_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
if(temp8 <= 0){ //here changed to <=
counter8.innerText = 0;
}else{
counter8.innerText=temp8-1;
}
}
我正在尝试制作一个从 0 开始到 12 结束的计数器我现在拥有的是一个我无法设置上限的计数器。所以基本上,我无法设置最大值和最小值。这是我的代码:
<div class="counter8">
<label id="blank"></label>
<div class="operations">
<a href="javascript:void(0)" onclick="dec_num8()" class="dec opr8">⇦</a>
<span class="count8">0</span>
<a href="javascript:void(0)" onclick="inc_num8()" class="inc opr8">⇨</a>
</div>
</div>
<script>
var add=document.querySelector(".inc");
var sub=document.querySelector(".dec");
let counter8=document.querySelector(".count8");
function inc_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
counter8.innerText=temp8+1;
if (temp8 > 12) {
counter8.value = 12;
} else {
counter8.value = temp8;
}
}
function dec_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
counter8.innerText=temp8-1;
}
</script>
增加按钮是我的尝试之一,但失败了。
您可以使用 Math.max and Math.min 来限制值。
<div class="counter8">
<label id="blank"></label>
<div class="operations">
<a href="javascript:void(0)" onclick="dec_num8()" class="dec opr8">⇦</a>
<span class="count8">0</span>
<a href="javascript:void(0)" onclick="inc_num8()" class="inc opr8">⇨</a>
</div>
</div>
<script>
var add=document.querySelector(".inc");
var sub=document.querySelector(".dec");
let counter8=document.querySelector(".count8");
function inc_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
counter8.innerText=Math.min(12,temp8+1);
}
function dec_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
counter8.innerText=Math.max(0,temp8-1);
}
</script>
如果您想使用 if 分支修复代码,您可以这样做:
if (temp8 >= 12) {
temp8 = 12;
} else {
temp8++;
}
counter8.innerText=temp8;
或在一行中:temp8 = temp8 >= 12 ? temp8 : temp8+1
对于最小的一个只是翻转版本
您并没有真正限制减号按钮上的最小计数器。而且你只有在检查条件后才增加它。 所以给你举个例子:
function inc_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
if (temp8 >= 12) { // here changed to >=
counter8.innerText = 12; //also use innerText, not value
} else {
counter8.innerText=temp8+1;
}
}
function dec_num8(){
var temp8=parseInt(counter8.innerText) >> 0;
if(temp8 <= 0){ //here changed to <=
counter8.innerText = 0;
}else{
counter8.innerText=temp8-1;
}
}