2015-07-29 7 views
92

Ich habe folgendes html5 Eingangselement:Warum erlaubt die HTML-Eingabe mit dem Typ "Nummer" die Eingabe des Buchstabens "e" in das Feld?

<input type="number"> 

Warum dieser Eingang für das Zeichen ‚e‘ erlauben, in das Eingabefeld eingegeben werden? Kein anderes Zeichen aus dem Alphabet ist in der Lage eingegeben wird (wie erwartet)

Chrom v Verwendung 44.0.2403.107

Um zu sehen, was ich meine:. http://www.w3schools.com/html/tryit.asp?filename=tryhtml_input_number

+1

Es ermöglicht auch + eingeben Sie, - und '.' mehrere Male in einigen Browsern. –

Antwort

104

Denn das ist genau das, wie the spec sagt sollte es funktionieren. Die Zahl Eingang kann floating point numbers, einschließlich negativer Symbole und die e oder E Charakter annehmen:

Eine Gleitkommazahl setzt sich aus den folgenden Teilen in genau der Reihenfolge:

  1. Optional kann die Das erste Zeichen kann ein "-" Zeichen sein.
  2. Ein oder mehrere Zeichen im Bereich "0—9".
  3. Optional können die folgenden Teile in genau der Reihenfolge:
    1. a "." character
    2. ein oder mehrere Zeichen in dem Bereich "0—9"
  4. Optional können die folgenden Teile, in genau der Reihenfolge:
    1. a "e" Zeichen oder "E" character
    2. optional ein "-" Zeichen oder "+" Zeichen
    3. Ein oder mehrere Zeichen im Bereich "0—9".
+1

Ah, danke. Ich habe in der [falschen Spezifikation] gesucht (http://dev.w3.org/html5/html-author/) – Gnarlywhale

+0

Ich bin immer noch verblüfft darüber, vor allem bin ich kein Mathematiker, also was macht " e "im Kontext einer Zahl stehen? Zweitens verstehe ich nicht, warum input.value eine leere Zeichenfolge ist, sobald Sie ein "e" darin schreiben, obwohl es Zahlen gibt und das Zeichen erlaubt ist ... – Simon

+0

@Simon Es ist der Exponent, Sie können es sehen in Aktion, wenn Sie eine große Zahl mit einer großen Zahl multiplizieren und der Rechner nicht genügend unterstützte Ziffern zur Anzeige hat. Jemand, der besser in der Mathematik ist, könnte es besser erklären. –

7
<input type="number" onkeydown="return FilterInput(event)" onpaste="handlePaste(event)" > 

function FilterInput(event) { 
    var keyCode = ('which' in event) ? event.which : event.keyCode; 

    isNotWanted = (keyCode == 69 || keyCode == 101); 
    return !isNotWanted; 
}; 
function handlePaste (e) { 
    var clipboardData, pastedData; 

    // Get pasted data via clipboard API 
    clipboardData = e.clipboardData || window.clipboardData; 
    pastedData = clipboardData.getData('Text').toUpperCase(); 

    if(pastedData.indexOf('E')>-1) { 
     //alert('found an E'); 
     e.stopPropagation(); 
     e.preventDefault(); 
    } 
}; 
+2

Wie sicher sind Sie, dass dies das Einfügen eines "E" -Zeichens mit der Kopie verhindert Funktionalität einfügen? – StephenKelzer

+1

Nur überprüft, Sie sind richtig, es funktioniert nicht für Kopieren und Einfügen. – Gnarlywhale

+0

Sie haben @StephenKelzer richtig eingestellt. Ich habe Code hinzugefügt, um damit umzugehen. – TruthSeeker

10

Wir können es wie so einfach machen unter

<input type="number" onkeydown="javascript: return event.keyCode == 69 ? false : true" />

+1

Besser, 'return event.keyCode! == 69' zu verwenden, da es einen unnötigen ternären Operator vermeidet. Ich würde auch nicht inlining empfehlen. –

Verwandte Themen