JQuery-Taste Auslöser einreichen bilden

Question

The following script enables users to prompt a value into the input field of a form: 

    <script> 
    $(document).ready(function(){ 
    $("button").click(function(){ 
     $('input[name="fine"]').val(computeEndTime($('input[name="ini"]').val())); 
    }); 
    function computeEndTime(ini){ 
     var parts = ini.split(/[:,\s\.]+/).map(Number); 
     var hourstart = parseInt(parts.shift()); 
     var minutestart = parseInt(parts.shift()); 
     var totalm = (hourstart * 60) + minutestart + 100; 
     var minutes = totalm%60; 
     var hours = (totalm - minutes)/60; 
     return hours + ":" + minutes; 
    } 
}); 
</script> 

Das HTML-Formular ist dies:

<form action="next.php" method="POST"> 
    <input type="text" name="ini" maxlength="5" /> 
    <input type="text" name="fine" maxlength="5" /> 
    <button>100</button> 
    <input type="submit" name="invia" value="go on" /> 
</form> 

Wie Sie sehen können, wird das Skript den Zeitwert nimmt in den Eingang eingegeben "ini" und über die Schaltfläche Aufforderungen in Eingabe "fine" ein anderer Zeitwert (die erste + 100 Minuten).

Das Problem, das ich habe ist, dass, wenn die Taste <button> gedrückt wird, auch die andere Taste des Formulars ausgelöst wird, und der Benutzer ist sofort auf die Seite umgeleitet next.php.

Wie kann ich dies vermeiden und vom Benutzer verlangen, dass er den Submit-Button drückt?

Answer 1

Ändern Sie den Knopf tun type="submit" Dies sollte, so dass es das Formular abschickt.

Answer 2

zu

<button type="button">100</button> 

Der Standard Der Trick

$("button").click(function(e){ 
    $('input[name="fine"]').val(computeEndTime($('input[name="ini"]').val())); 
    e.preventDefault(); 
});