Warum gibt meine jQuery den Wert meiner Gleichung nicht zurück?

-3

Ich habe ein einfaches Eingabefeld, in dem ein Benutzer eine einfache Gleichung geben würde (keine Variablen)Warum gibt meine jQuery den Wert meiner Gleichung nicht zurück?

Zum Beispiel würde ein Benutzer

(5 + 6) eingeben * 7 -2

Und wenn der Benutzer den "Calculate" -Button betätigt, löst er die jQuery aus, die die Eingabe mithilfe von .toString() konvertiert, was wiederum die Gleichung löst und den Wert dann im Element platziert.

Ich bin relativ neu, also entschuldige ich mich, wenn ich wirklich schlechte Fehler mache. Ich hoffe, ich habe das richtig erklärt.

Hier ist der HTML

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Interview exercise</title> 
    <script type="text/javascript" src="test.js"></script> 
</head> 
<body> 
    <input name = "equation"/> = <span id="answer"/> 
    <br/> 
    <button>Calculate</button> 
</body> 
</html>

Hier ist die JavaScript/jQuery

$(document).ready(function() { 
    $('button').click(function() { 
     var answer = $("input[name=equation]").toString(); 
     $('#answer') = answer; 
    }); 
});

Quelle

2016-11-02 flatafor

Ein String ist kein mathematisches Betrieb. Sie müssten die Zeichenfolge parsen und im Grunde Ihren eigenen Rechner implementieren. – Derek

versuche '$ (" # antwort "). Text (eval (antwort))' – Isaac

'eval' kann verwendet werden, aber das ist nicht sicher. –

ich nicht über die JavaScript-Funktion eval() nicht kannte.
Vielen Dank an die Argumentation zwischen @nnnnnn und @ DanielA.White!

über eval() seine unsicher:
Hier ist ein weiterer SO answer to explain the risks, die in Ihrem Fall sind nicht vorhanden.

So, hier ist die Berechnungsfunktion für Ihre HTML:

$(document).ready(function(){ 
 
    $('button').click(function(){ 
 
     var answer = eval($("input[name='equation']").val()); 
 
     $('#answer').html(answer); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<input name="equation" value="(5+6) * 7 -2"> = <span id="answer"></span> 
 
<br> 
 
<button>Calculate</button>

EDIT
Um die .val() Funktion sicherer zu machen ..
Aber vor allem um unmögliche Berechnungen zu verhindern, hier ein Update!

Dieses längliche Skript filtert nach "erlaubten Schlüsseln" von der Tastatur.

Dennoch, wenn eine unmögliche Berechnung eingegeben wird, wie 4//(68+(),
es gibt: «Etwas in Ihrer Gleichung falsch ist.»

$(document).ready(function(){ 
 
    var allowedKeys=[48,49,50,51,52,53,54,55,56,57, // 0 to 9 (keyboard) 
 
        96,97,98,99,100,101,102,103,104,105, // 0 to 9 (numpad) 
 
        111,106,109,107,110, // characters/* - + . (numpad) 
 
        189,190,8,32,13 // character - . [backspace] [space] [enter] (keyboard) 
 
        ]; 
 
    var allowedShiftKeys=[51,56,57,48,187,57,48,16]; // characters/* + () [shift] (keyboard + shift) 
 

 
    $("input[name='equation']").on("keydown",function(e){ 
 
     // Clear previous answer 
 
     $('#answer').html(""); 
 

 
     // Check for allowed keydown 
 
     if(($.inArray(e.which,allowedKeys) != -1 && !e.shiftKey) || ($.inArray(e.which,allowedShiftKeys)!=-1 && e.shiftKey)){ 
 
      console.log("Allowed key."); 
 
     }else{ 
 
      // Don't print the key in the input field. 
 
      console.log("Disllowed key."); 
 
      e.preventDefault(); 
 

 
      // Helper to find key number 
 
      console.log(e.which); 
 
     } 
 

 
     // [enter] handler to simulate a button click. 
 
     if(e.which==13){ 
 
      $('button').click(); 
 
     } 
 
    }); 
 

 
    $('button').click(function(){ 
 
     var InputtedValue = $("input[name='equation']").val(); 
 
     
 
     // Remove "//" sequence... Which has the special meaning of a "comment start". 
 
     // Has to be removed before eval() works. 
 
     for(i=0;i<InputtedValue.length;i++){ 
 
      var position = InputtedValue.indexOf("//"); 
 
      if(position!=-1){ 
 
       console.log('Removing "//" occurance.'); 
 
       InputtedValue = InputtedValue.replace("//","/"); 
 
       // Redo the loop from start. 
 
       i=0; 
 
       $("input[name='equation']").val(InputtedValue); 
 
      } 
 
     } 
 

 
     // Try the eval() function... And catch the error if any (Error will come from the inputted formula). 
 
     // Prevents the script from just jamming here. 
 
     try{ 
 
      var answer = eval(InputtedValue); 
 
     } 
 
     catch(error){ 
 
      console.log("ERROR: "+error.message); 
 
     } 
 

 
     // If there is an answer. 
 
     if(typeof(answer)==="number"){ 
 
      $('#answer').html(answer); 
 
     }else{ 
 
      $('#answer').html("Something is wrong in your equation."); 
 
     } 
 
     console.log("Answer: "+answer); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input name="equation" value="(5+6) * 7 -2"> = <span id="answer"></span> 
 
<br> 
 
<button>Calculate</button>

Quelle

2016-11-02 17:00:55

Gibt es eine Möglichkeit, dass es mit der Reihenfolge der Operationen ausgeführt wird, wenn der Benutzer keine Klammern eingibt? – flatafor

Ich arbeite gerade an einem Klammerproblem ... Aber nicht an diesem. Wenn eine Klammer fehlt, schlägt die Überprüfung fehl und das Skript wird abgebrochen. Jetzt, wenn überhaupt keine Klammer ist, ist ein anderes Spiel !! Ich habe nicht bemerkt, dass 'eval()' es nicht "richtig auswertet" ... Wird prüfen, was ich tun kann, aber ich werde zuerst meine tatsächlichen Verbesserungen veröffentlichen (in ein paar Minuten). –

mmm. Aus dem ersten Test, den ich gerade gemacht habe, berücksichtigt 'eval()' ** die Operationsreihenfolge, wenn keine Klammern vorhanden sind. –

Warum gibt meine jQuery den Wert meiner Gleichung nicht zurück?

Antwort

Verwandte Themen