Hallo Leute
ich habe hier den Code für 6 Buttons die 3 Variablen einzeln zwischen den Werten 0 und 100 hoch und runterschrauben können.
Jetzt sollen die Werte der 3 Variablen ( nicht mehr nach oben verändert werden können, wenn die 3 Variablen zusammengerechnet 100 ergeben.
Wie kann man das am Besten machen?
Code
<p class="ausgang">0 % Button</p>
<p class="ausgang">0 % Button</p>
<p class="ausgang">0 % Button</p>
)
Code
<div class="row"><button class="Button" id="Button10" data-helfer="0,1">Button +</button>
<button class ="Button" class="Button5" data-helfer="0,2">Button -</button>
</div>
<div class="row"><button class="Button" id="Button9" data-helfer="1,1">Button+</button>
<button class ="Button" class="Button6" data-helfer="1,2">Button -</button>
</div>
<div class="row"><button class="Button" id="Button8" data-helfer="2,1">Button +</button>
<button class="Button" class="Button7" data-helfer="2,2">Button -</button>
</div>
<p class="ausgang">0 % Button</p>
<p class="ausgang">0 % Button</p>
<p class="ausgang">0 % Button</p>
<script>
let max=100;
let min=0;
let hoch=10;
but=document.querySelectorAll('Button');
but.forEach(function(f){
f.addEventListener('click',function(){
arr=f.getAttribute('data-helfer');
weiter(arr[0],arr[2]);
})
});
function weiter(vari,was){
var output = document.getElementsByClassName("ausgang")[vari];
l=output.innerHTML;
console.log(l);
const g=was==1 ? 1 : 2;
if(g==1){
z=parseInt(l)+parseInt(hoch);
}else{
z=parseInt(l)-parseInt(hoch);
}
if(z>max){
z=max;
}
if(z<min){
z=min;
}
output.innerHTML=z;
}
</script>
</body>
</html>
Alles anzeigen