2016-08-20 2 views
0

Ich versuche, damit einfache Mathematik zu machen. Das Problem ist, dass das Ergebnis nie angezeigt wird.Wert zur Eingabe hinzufügen

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js" ></script> 
    <script type="text/javascript" src="script.js"></script> 
    <title></title> 
</head> 
<body> 
    <form> 
     <input id="data1" type="number" name="data1"> 
     <br> 
     <input id="data2" type="number" name="data2"> 
     <br> 
     <input id="button" type="submit"> 
     <br> 
     <br> 
     <input id="result" type="number" name="result" value="1"> 
    </form> 
</body> 
</html> 

JS: Hier habe ich meine Variablen. Das Ergebnis der Gleichung sollte am Eingang #result angezeigt werden.

$(document).ready(function(){ 

    var result = 0; 
    $("#result").val(result); 

    $("#button").click(function() { 

     var data1 = $("#data1").val(); 
     var data2 = $("#data2").val(); 

     result = $(data1 * data2); 

     $("#result").val(result); 

    }); 

}); 

Antwort

0

In Ihrem folgenden Fragmente, result wird ein Objekt

result = $(data1 * data2); 

Änderung sein, es zu:

result = data1 * data2; 

Der Rest des Codes gut aussieht. Wie in den anderen Kommentaren empfohlen, vergessen Sie nicht, den Anruf zu preventDefault()

$(document).ready(function(){ 
    var result = 0; 
    $("#result").val(result); 

    $("#button").click(function(evt) { 
     evt.preventDefault(); 
     var data1 = $("#data1").val(); 
     var data2 = $("#data2").val(); 

     result = data1 * data2;  
     $("#result").val(result); 
    }); 
}); 
+0

hinzuzufügen Dies funktionierte! Vielen Dank! – notooanon

2

Fügen Sie einen Standardfehler hinzu, um das Senden und Neuladen der Seite zu verhindern.

$(document).ready(function(){ 

var result = 0; 
$("#result").val(result); 

$("#button").click(function(evt) { 
    evt.preventDefault(); 
    var data1 = $("#data1").val(); 
    var data2 = $("#data2").val(); 

    result = $(data1 * data2); 

    $("#result").val(result); 

}); 

}); 
0

Ein form hat einige Standardparameter. Es hat das, auch wenn du nichts weitergibst wie du. Zum Beispiel hat es eine action - das ist standardmäßig auf der Website, auf der Sie gerade sind. Daher wird das Formular (eine GET Anfrage - die eine andere Standardeinstellung ist - an die URL gesendet, auf der Sie sich befinden), wenn Sie auf die Senden-Schaltfläche klicken. Egal wie viele Parameter Sie übergeben. Um zu verhindern, dass ein Formular dies tut. Sie können die Methode preventDefault() verwenden.

$("#button").click(function(e) { 
    e.preventDefault(); 
    // ... rest of your code 
} 

Dies wird Ihre Form von wirklich Absenden der Daten/Form/selbst stoppen - und Sie seine Werte mit js auf der gleichen Seite verarbeiten können.

Verwandte Themen