当达到最大值时总结范围内的范围和阻塞范围

Question

所以我正在尝试RPG角色生成器的脚本，并希望人们设置他们的统计。这些统计数据可以从1到10。用户使用常规的HTML范围来设置它们。我总结了这些，直到用户总体达到18分。这里的问题是，我不知道如何在18分命中时阻止愤怒上升。 我总结的统计数据像这样：

<fieldset id="attribute" oninput="streight.value=parseInt(staerke.value);wisdom.value=parseInt(weisheit.value);agility.value=parseInt(geschick.value);APWert.value=parseInt(staerke.value)+parseInt(weisheit.value)+parseInt(geschick.value)+'/36'"> 
        <legend>Attribute</legend> 
         <label for="staerke">Stärke</label> 
         <input type="range" id="staerke" value="1" min="1" max="10"> 
         <output name="streight" for="staerke">1</output> 

         <label for="weisheit">Weisheit</label> 
         <input type="range" id="weisheit" value="1" min="1" max="10"> 
         <output name="wisdom" for="weisheit">1</output> 

         <label for="geschick">Geschick</label> 
         <input type="range" id="geschick" value="1" min="1" max="10"> 
         <output name="agility" for="geschick">1</output> 

         <output name="APWert" id="APWert" for="ap">3/18</output> 
</fieldset> 

这是统计的范围，输入的数值，总结起来，并显示他们在输出无需重新加载页面。但是我不知道如何在达到最大值18时停止量程输入。 我会很感激任何形式的帮助。

Answer 1

您可以在每次输入三个输入中的任何一个输入发生变化时执行验证。这将是这个样子：

在HTML

<input type="range" id="staerke" value="1" min="1" max="10" onchange ="value_changed()"> 
<input type="range" id="weisheit" value="1" min="1" max="10" onchange ="value_changed()"> 
<input type="range" id="geschick" value="1" min="1" max="10" onchange ="value_changed()"> 

在JS

function value_changed(){ 
    //pull in the three values 
    var staerke_value = parseInt($("#staerke").val()); 
    var weisheit_value = parseInt($("#weisheit").val()); 
    var geschick_value = parseInt($("#geschick").val()); 

    if((staerke_value + weisheit_value + geschick_value) > 18){ 
    //if you are out of the range alert the user 
    alert("you messed up!"); 
    } 
}