2016-10-06 6 views
0

Sagen wir, ich habe ein HTML-Formular mit zwei Textfeldern, ich möchte die zwei Zahlen in den beiden Textfeldern hinzufügen und das Ergebnis in einem Absatz anzeigen. Wie kann ich das machen?Wie setze ich einen Absatz in einen Textfeldtext ein

Ändern Absatz nach Textbox ist was ich nicht finden kann!

+0

bitte einige Code fügen Sie die Frage –

+0

http://stackoverflow.com/questions/11961474/how-to-sum-two-numbers-from-input- zu erklären Tag – adeneo

+0

zeigen Sie Ihren einfachen Code –

Antwort

1

Ganz einfach:

document.getElementById('sum').onsubmit = add; 
 

 
function add(e) { 
 
    e.preventDefault(); 
 
    var num1 = document.getElementById('num1').value; 
 
    var num2 = document.getElementById('num2').value; 
 
    var result = 'Result: ' + String(parseInt(num1) + parseInt(num2)); 
 
    var p = document.getElementById('result'); 
 
    p.innerHTML = result; 
 
}
<form id="sum"> 
 
    <label for="num1">First number:</label> 
 
    <br /> 
 
    <input type="text" id="num1" /> 
 
    <br /> 
 
    <label for="num1">Second number:</label> 
 
    <br /> 
 
    <input type="text" id="num2" /> 
 
    <br /> 
 
    <input type="submit" value="Add" /> 
 
</form> 
 

 
<p id="result">Result:</p>

Im html wir ein Formular mit drei Eingängen haben, 2 sind vom Typ Text und ist einreichen Typ. und auch ein Absatz.

In dem Javascript weisen wir dem onsumbit-Ereignis des Formulars die Funktion add() zu, in der Funktion verhindern wir den Standard, so dass das Formular die Seite nicht aktualisiert, dann erhalten wir die 2 Werte, die eingegeben wurden enthält die Summe dieser Werte und legt die innerHTML des Absatzes darauf fest.

-1

In diesem Beispiel haben Sie ein Formular mit 2 Eingaben. Wenn Sie auf eine Schaltfläche drücken, wird der Wert dieser 2 Eingabe innerhalb eines Absatzes hinzugefügt.

Hoffe diese Hilfe.

function addInputContentToParagraph() { 
 
    var txtValue1 = document.getElementById('textbox1').value; 
 
    var txtValue2 = document.getElementById('textbox2').value; 
 
    
 
    document.getElementById('para').innerHTML = txtValue1 + ' ' + txtValue2; 
 
}
a { 
 
    cursor:pointer; 
 
    border:1px solid #333; 
 
    padding:4px; 
 
    margin:10px; 
 
    display:inline-block; 
 
}
<form id="myForm" name="myForm"> 
 
    <input type="text" name="textbox1" id="textbox1" value="1"> 
 
    <input type="text" name="textbox2" id="textbox2" value="2"> 
 
</form> 
 
<a onclick="addInputContentToParagraph();">Add Input Values to Paragraph</a> 
 
<p id="para"></p>

0

einen Taschenrechner-Funktion erstellen und dann können Sie es auf keyup Feuer oder Sie können es auf eine Taste zuweisen, wenn Sie möchten.

function calcTotal(){ 
 
    var inputs = document.getElementsByTagName('input'), 
 
     result = 0; 
 
    for(var i=0;i<inputs.length;i++){ 
 
    if(parseInt(inputs[i].value)) 
 
     result += parseInt(inputs[i].value); 
 
    } 
 
    document.getElementById('total').innerHTML = 'Total: ' + result; 
 
}
<form> 
 
    <input onkeyup="calcTotal()" type="text" /> 
 
    <input onkeyup="calcTotal()" type="text" /> 
 
</form> 
 

 
<p id="total"></p>

0

folgen unten JS-Code:

<html> 
    <head> 
     <title>Sum Two Number</title> 
     <script language="javascript"> 
       function addNumbers() 
       { 
         var val1 = parseInt(document.getElementById("value1").value); 
         var val2 = parseInt(document.getElementById("value2").value); 

         if(val1 !== "" && val2 !== "") { 
          var result = val1 + val2; 
          document.getElementById('result').innerHTML = result; 
         }      
       } 
     </script> 
    </head> 
    <body> 
     value1 = <input type="text" id="value1" name="value1" value="0" onkeyup="javascript:addNumbers()"/> 
     value2 = <input type="text" id="value2" name="value2" value="0" onkeyup="javascript:addNumbers()"/> 
     <p>Answer = <span id="result"></span></p> 
    </body> 
</html> 
Verwandte Themen