JS kein Alert bei Vergleichsoperation

achillix · 21.02.2012, 20:34

Hallo Leute,
ich habe da ein kleines Problem mit einer Vergleichsoperation.
Ich habe ein kleines Java Script welches mir eine Warnung mitteilen soll, wenn ich in einem Textfeld eine Zahl grösser als 200 eingebe. Jedoch springt der alert nicht auf, wenn ich das Textfeld verlasse. Hier der komplette Code:

PHP-Code:

  <!DOCTYPE html> 

<html lang="en"> 

<head> 

<meta charset="utf-8"> 

<title>Page</title> 

<script type="text/javascript"> 

function check(min, max) { 

var num = parseInt(this.value); 

if (min > num || max < num) 

{ alert(num + ' ist nicht zwischen ' + min + ' und ' + max); 

} 

} 

</script> 

</head> 

<body> 

<form> 

Zahl: <input type='text' onblur="check(0, 100)" > 

</form> 

</body> 

</html>

Ich knabere jetzt schon seit 3 Stunden daran und verstehe nicht, warum die Warnung nicht reagiert beim verlassen des Textfeldes (da das event auf onblur steht).
Habt ihr eine Idee, was an diesem Code falsch ist?
Ich habe auch den Firebug benutzt, aber Fehler habe ich keine gefunden.

Vielen Dank und Gruss

Achillix

luzip · 21.02.2012, 20:51

Hallo,

in der Funktion kannst Du this, glaub ich, nicht so einfach verwenden. Du musst das Input mit an die Funktion mit this übergeben.

Grüße,
André

nikosch · 21.02.2012, 21:04

Hmm, doch, das sollte gehen. Aber guter Stil ist das nicht, die Funktion so aufzubauen, dass sie nur für diese konkrete Anwendung funktioniert. Allerdings hast Du nicht beachtet, dass der Callback eines Eventhandlers als erstes Argument das Eventobjekt „verpasst bekommt“. Folglich steht in min und max nicht das, was DU da erwartest.

achillix · 21.02.2012, 21:15

Hallo
erstmal vielen Dank zu so später Stunde, für eure Hilfe.
Ich habe es mit document.getElementById hinbekommen.
Hier die Lösung:

PHP-Code:

  <!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>Page</title> 
<script type="text/javascript"> 
function check(min, max) { 
var num = parseInt(document.getElementById('value_one').value);
if (min > num || max < num) 
{ alert(num + ' ist nicht zwischen ' + min + ' und ' + max); 
} 
}  
</script> 
</head> 
<body> 
<form> 
Zahl: <input type='text' id='value_one' onBlur="check(0, 100)" > 
</form> 
</body> 
</html>

Vielen Dank und Gruss

Achillix

nikosch · 21.02.2012, 21:19

Das ist noch schlimmer. Wenn Du noch so einen check brauchst, kannst Du so die Funktion nicht wiederverwenden, sondern muss Copy & Paste verwenden.

achillix · 21.02.2012, 21:55

Zitat:

Zitat von nikosch

Das ist noch schlimmer. Wenn Du noch so einen check brauchst, kannst Du so die Funktion nicht wiederverwenden, sondern muss Copy & Paste verwenden.

Zu meiner Verteidigung, möchte ich noch hinzufügen, das ich, was Java Script angeht, totaler Anfänger

.
Ich versuch jedoch mich da reinzuarbeiten.
Habe da noch eine Frage, zwecks der Erweiterung dieses Events (wenn man das überhaupt so nennen kann).
Es sollen eigentlich 2 Abfragen statfinden. Die erste ist also die Abfrage ob es eine Zahl zwischen 0 und 100 ist, die ich eingegeben habe. Das funktioniert.
Wenn ich jetzt, aber einen Wert ab der Zahl 50 bis 100 eingebe(in der selben Textbox), soll eine weitere Messagebox (alert) aufspringen und mir sagen das aber der Zahl 50, neue Werte ermittelt werden.
Es geht mir nur um die Messagebox, die reagieren soll, sonst nichts. Kann man das miteinbauen?

Vielen Dank und Gruss

Achillix

rudygotya · 22.02.2012, 00:02

radix parameter bei parseInt mit angeben! Deine Funktion sollte nicht vom DOM-Tree abhängig sein.

jspit · 22.02.2012, 08:23

Du hast hier eine unzuverlässige Speziallösung, die bei Eingaben mit Vornullen auch noch falsche Werte bringt (Hinweis von rudygotya). this hast du falsch verwendet, es liefert hier in der function das window-object. this als Parameter im Aufruf liefert dir den gewünschten Zugriff. Hab dein Code mal etwas erweitert um dies zu zeigen:

Code:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>Page</title> 
<script type="text/javascript"> 
function check(thisArg, minVal, avgVal, maxVal) { 
  var argValue = Number(thisArg.value);
  if(argValue >= minVal && argValue <= maxVal) {
    if(argValue >= avgVal) alert('Ab ' + avgVal + ' werden neue Werte ermittelt!');
  var r=0;
  }
  else {
    alert(thisArg.value + ' aus dem Feld ' + thisArg.name + ' ist nicht zwischen ' + minVal + ' und ' + maxVal); 
  }
}   
</script> 
</head> 
<body> 
<form> 
Zahl: <input type='text' id='value_one' name="Testeingabe" onblur="check(this,0, 50, 100)" > 
</form> 
</body> 
</html>

Mit this als Parameter im Functionsaufruf kannst du in der function auf alle Attribute deines input-Elementes zugreifen (.value , .name, .id).
Die function kannst du dann nur für Elemente einsetzen, welche auch diese Attribute haben. Alternativ kann auch this.value beim Aufruf verwendet werden, in der function wird dann direkt mit thisArg gearbeitet und der name steht nicht zur Verfügung.
Number hat gegenüber parseInt den Vorteil dass auch Dezimalzahlen wie 23.6 als Eingabe akzeptiert werden. Ob das gewünscht ist ?
Was du da mit der 50 machen möchtest hab ich nicht so ganz verstanden. Das obige Beispiel, wo es noch so einiges verbesserungswürdig ist, solltest du nach deinen Wünschen modifizieren und erweitern können.

LG jspit

xm22 · 22.02.2012, 11:36

Zitat:

Allerdings hast Du nicht beachtet, dass der Callback eines Eventhandlers als erstes Argument das Eventobjekt „verpasst bekommt“.

Nur, wenn auch eine Funktionsreferenz übergeben wird. Dort wird einfach eine Funktion aufgerufen, daher ist das schon richtig.

achillix · 24.02.2012, 16:27

Hallo

sorry das ich mich erst jetzt melde und vielen lieben dank für eure Zeit und mühen.
@jspit
Vielen Dank für deine Erklärungen bzw meines this Fehlers, ist sehr aufschlussreich und werde ich mir für die Zukunft merken. Und ebenfalls vielen Dank für deine Code Erweiterung, welche ich getestet habe. Es läuft einwandfrei. und gefällt mir ehrlich gesagt besser als meine bisherige Lösung, die ich hatte:

PHP-Code:

  <script type="text/javascript">
function minMax() {
    var min = 0;
    var mid = 100;
    var max = 199;
    var num = parseInt(document.getElementById('value_one').value);
    if (num > mid && num < max) {
        var r = confirm(num + ' n\'is greater than ' + mid+ '. Press Yes to retain it.');
        if (r == false) document.getElementById('value_one').value = "";
        return false;
    }
    if (min > num || max < num) {
        alert(num + ' n\'is not between ' + min + ' and ' + max);
        return false;
    }
}
</script>

Wie ihr erkennen könnt habe ich mich da an get.ElementById festgebissen, da ich einfach nicht weiter wusste. Mein Code übernimmt zwar die gewünschten Anforderungen, aber wenn ich wählen kann, dann greife ich doch lieber zu der Lösung von jspit.

Vielen lieben Dank und Gruss

Achillix

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Alert Funktion	zorro69	PHP Einsteiger	4	10.12.2011 18:20
Alert() onclick Reload Page	Kein Genie	JavaScript, Ajax und mehr	2	11.09.2010 11:34
[Erledigt] Was passiert wenn ein Alert Fenster geöffnet wird	martl666	JavaScript, Ajax und mehr	4	30.03.2009 17:29
[Erledigt] setinterval() arbeitet nur mit alert() richtig	Patrick H.	JavaScript, Ajax und mehr	8	25.11.2008 13:24
AJAX Response: Firebug gibt Alert aus	Curanai	HTML, Usability und Barrierefreiheit	1	20.01.2008 20:38
alert....	dh1sbg	HTML, Usability und Barrierefreiheit	4	28.01.2007 11:59
Javascript alert()	fmueller	HTML, Usability und Barrierefreiheit	2	31.05.2006 13:32
absatz in alert box	Matthiasnet	HTML, Usability und Barrierefreiheit	4	23.09.2005 12:51
Alert Box mit PHP		PHP Tipps 2005-2	8	12.09.2005 10:59
alert window nach abschicken von formular	Sclot	HTML, Usability und Barrierefreiheit	6	15.04.2005 18:10
wenn alert erscheint kein submit		HTML, Usability und Barrierefreiheit	3	20.10.2004 16:10
ein alert fenster beim abschicken eines formulars	Sclot	HTML, Usability und Barrierefreiheit	1	13.10.2004 13:20
Vergleichsoperation für IF...THEN... aus Variable		PHP-Fortgeschrittene	2	01.09.2004 14:15
alert --> anderer Titel?		HTML, Usability und Barrierefreiheit	5	08.07.2004 15:39

21.02.2012, 20:34
achillix Benutzer Registriert seit: 25.07.2011 Beiträge: 41 PHP-Kenntnisse: Anfänger	JS kein Alert bei Vergleichsoperation Hallo Leute, ich habe da ein kleines Problem mit einer Vergleichsoperation. Ich habe ein kleines Java Script welches mir eine Warnung mitteilen soll, wenn ich in einem Textfeld eine Zahl grösser als 200 eingebe. Jedoch springt der alert nicht auf, wenn ich das Textfeld verlasse. Hier der komplette Code: PHP-Code: `<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Page</title> <script type="text/javascript"> function check(min, max) { var num = parseInt(this.value); if (min > num \|\| max < num) { alert(num + ' ist nicht zwischen ' + min + ' und ' + max); } } </script> </head> <body> <form> Zahl: <input type='text' onblur="check(0, 100)" > </form> </body> </html>` Ich knabere jetzt schon seit 3 Stunden daran und verstehe nicht, warum die Warnung nicht reagiert beim verlassen des Textfeldes (da das event auf onblur steht). Habt ihr eine Idee, was an diesem Code falsch ist? Ich habe auch den Firebug benutzt, aber Fehler habe ich keine gefunden. Vielen Dank und Gruss Achillix


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

21.02.2012, 20:51
luzip Erfahrener Benutzer Registriert seit: 28.11.2011 Beiträge: 115 PHP-Kenntnisse: Fortgeschritten	Hallo, in der Funktion kannst Du this, glaub ich, nicht so einfach verwenden. Du musst das Input mit an die Funktion mit this übergeben. Grüße, André

21.02.2012, 21:04
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Hmm, doch, das sollte gehen. Aber guter Stil ist das nicht, die Funktion so aufzubauen, dass sie nur für diese konkrete Anwendung funktioniert. Allerdings hast Du nicht beachtet, dass der Callback eines Eventhandlers als erstes Argument das Eventobjekt „verpasst bekommt“. Folglich steht in min und max nicht das, was DU da erwartest. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

21.02.2012, 21:15
achillix Benutzer Registriert seit: 25.07.2011 Beiträge: 41 PHP-Kenntnisse: Anfänger	Hallo erstmal vielen Dank zu so später Stunde, für eure Hilfe. Ich habe es mit document.getElementById hinbekommen. Hier die Lösung: PHP-Code: `<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Page</title> <script type="text/javascript"> function check(min, max) { var num = parseInt(document.getElementById('value_one').value); if (min > num \|\| max < num) { alert(num + ' ist nicht zwischen ' + min + ' und ' + max); } } </script> </head> <body> <form> Zahl: <input type='text' id='value_one' onBlur="check(0, 100)" > </form> </body> </html>` Vielen Dank und Gruss Achillix

21.02.2012, 21:19
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Das ist noch schlimmer. Wenn Du noch so einen check brauchst, kannst Du so die Funktion nicht wiederverwenden, sondern muss Copy & Paste verwenden. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

22.02.2012, 00:02
rudygotya Erfahrener Benutzer Registriert seit: 28.05.2008 Beiträge: 2.094 PHP-Kenntnisse: Fortgeschritten	radix parameter bei parseInt mit angeben! Deine Funktion sollte nicht vom DOM-Tree abhängig sein. __________________ ++++ Wieder einer ins Netz gegangen: Phishers Fritz zufrieden ++++ Blog

22.02.2012, 08:23
jspit Erfahrener Benutzer Registriert seit: 19.08.2011 Beiträge: 701 PHP-Kenntnisse: Anfänger	Du hast hier eine unzuverlässige Speziallösung, die bei Eingaben mit Vornullen auch noch falsche Werte bringt (Hinweis von rudygotya). this hast du falsch verwendet, es liefert hier in der function das window-object. this als Parameter im Aufruf liefert dir den gewünschten Zugriff. Hab dein Code mal etwas erweitert um dies zu zeigen: Code: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Page</title> <script type="text/javascript"> function check(thisArg, minVal, avgVal, maxVal) { var argValue = Number(thisArg.value); if(argValue >= minVal && argValue <= maxVal) { if(argValue >= avgVal) alert('Ab ' + avgVal + ' werden neue Werte ermittelt!'); var r=0; } else { alert(thisArg.value + ' aus dem Feld ' + thisArg.name + ' ist nicht zwischen ' + minVal + ' und ' + maxVal); } } </script> </head> <body> <form> Zahl: <input type='text' id='value_one' name="Testeingabe" onblur="check(this,0, 50, 100)" > </form> </body> </html> Mit this als Parameter im Functionsaufruf kannst du in der function auf alle Attribute deines input-Elementes zugreifen (.value , .name, .id). Die function kannst du dann nur für Elemente einsetzen, welche auch diese Attribute haben. Alternativ kann auch this.value beim Aufruf verwendet werden, in der function wird dann direkt mit thisArg gearbeitet und der name steht nicht zur Verfügung. Number hat gegenüber parseInt den Vorteil dass auch Dezimalzahlen wie 23.6 als Eingabe akzeptiert werden. Ob das gewünscht ist ? Was du da mit der 50 machen möchtest hab ich nicht so ganz verstanden. Das obige Beispiel, wo es noch so einiges verbesserungswürdig ist, solltest du nach deinen Wünschen modifizieren und erweitern können. LG jspit

24.02.2012, 16:27
achillix Benutzer Registriert seit: 25.07.2011 Beiträge: 41 PHP-Kenntnisse: Anfänger	Hallo sorry das ich mich erst jetzt melde und vielen lieben dank für eure Zeit und mühen. @jspit Vielen Dank für deine Erklärungen bzw meines this Fehlers, ist sehr aufschlussreich und werde ich mir für die Zukunft merken. Und ebenfalls vielen Dank für deine Code Erweiterung, welche ich getestet habe. Es läuft einwandfrei. und gefällt mir ehrlich gesagt besser als meine bisherige Lösung, die ich hatte: PHP-Code: <script type="text/javascript"> function minMax() { var min = 0; var mid = 100; var max = 199; var num = parseInt(document.getElementById('value_one').value); if (num > mid && num < max) { var r = confirm(num + ' n\'is greater than ' + mid+ '. Press Yes to retain it.'); if (r == false) document.getElementById('value_one').value = ""; return false; } if (min > num \|\| max < num) { alert(num + ' n\'is not between ' + min + ' and ' + max); return false; } } </script> Wie ihr erkennen könnt habe ich mich da an get.ElementById festgebissen, da ich einfach nicht weiter wusste. Mein Code übernimmt zwar die gewünschten Anforderungen, aber wenn ich wählen kann, dann greife ich doch lieber zu der Lösung von jspit. Vielen lieben Dank und Gruss Achillix