Fehlersuche JS-bedingte

Question

Ich habe eine Fehlerbehebung für ein Formular, mit dem Benutzer einen Betrag auswählen oder einen anderen Betrag auswählen können. Der andere Betrag, wenn Sie darauf klicken, ändert den Betrag auf $ 5. Ich versuche, es zu bekommen, so dass, wenn der Benutzer versucht, eine Zahl wie 10, 15 oder 20 als Beispiele einzugeben, es ihnen erlauben wird, es zu tippen. Momentan konvertiert es alles weniger als 5 für die Startnummer zu 5, was es unmöglich macht.

$("#donrAmountInput").on("input", function() { 
    setDonrAmount("Other"); 
}); 

function setDonrAmount(id) { 
    var amt; 
    $('#donrAmountButtons .active').removeClass('active'); 

    if (id == "Other") { 
    amt = $("#donrAmountInput").val() > 5 ? $("#donrAmountInput").val() : 5; 
    $('#otherAmount button').addClass('active'); 
    } 
    else { 
    amt = id.substring(10); 
    $('#donrAmount' + amt).addClass('active'); 
    } 

    $('input#donrAmountInput').val(amt); 
    $('input#donrAmountInput').change(); 
    $('#donrReviewAmount').html(amt); 
} 

Als Referenz hier ist das eigentliche Formular. Hilfe würde sehr geschätzt werden. https://secure.pva.org/site/c.ajIRK9NJLcJ2E/b.9381225/k.8668/FY2016_March_Congressional/apps/ka/sd/donorcustom.asp

Answer 1

Sie können Ihre inputTyp-number angeben min, max, required Attribute und dann überprüfen Sie die Gültigkeit davon über Javascript/jQuery gesetzt.

function myFunction() { 
 
    var inpObj = $("#id1")[0]; 
 
    if (inpObj.checkValidity() === false) { 
 
     $("#demo").html(inpObj.validationMessage); 
 
    } else { 
 
     $("#demo").html(inpObj.value); 
 
} 
 
} 
 
$('button').on('click',function(){ 
 
myFunction(); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="id1" type="number" min="5" max="300" required> 
 
<button>OK</button> 
 

 
<p id="demo"></p>