Dieser Teil ist in Ordnung (habe ich mir erlaubt, die Vertiefung der Befestigung):
function checknewaccount(){
return emailvalid() && checkname() && passwordcheck();
}
Dieser Teil Fehler ist eine Syntax (um es milde auszudrücken:
function checknewaccount(){
if(emailvalid()&& checkname() && passwordcheck())
{
return true;
}
else{
return false;
}
}
Obwohl Sie es verbessern könnte):
Wenn das kein echtes Zitat aus Ihrem Code ist, müssen Sie yo aktualisieren Ihre Frage (obwohl ich vielleicht nicht hier bin, um diese Antwort zu aktualisieren). Es macht keinen Sinn, nach Code zu fragen und dann Pseudo-Code in der Frage zu zitieren. (. Am allerwenigsten, der Pseudo-Code, um die endgültigen }
fehlt)
Die gleiche Art der Sache gilt für Ihre Funktionen in der Form:
function emailvalid()
{
if(email condition)
{
return true;
}
else {
return false;
}
}
ist die in Ordnung (unter der Annahme, dass email condition
ist noch psuedocode), aber es gibt keine Notwendigkeit für die if
:
function emailvalid()
{
return email condition;
}
In Bezug auf die „nichts passiert“ Sie Debugging-Tools stellen Sie sicher, haben Sie uns e. In Chrome sind Entwicklungswerkzeuge integriert. Drücken Sie einfach Strg + Umschalt + I. Für Firefox können Sie den ausgezeichneten Firebug installieren. In neueren Versionen von IE sind ebenfalls Entwicklungswerkzeuge integriert (für ältere Versionen können Sie eine kostenlose Version von Visual Studio herunterladen, die sich in den Browser einklinken kann). Jede dieser Anweisungen wird Sie über Syntax- und andere Fehler informieren. Sie können Ihre Anweisungen in den einzelnen Anweisungen nacheinander durchgehen, um herauszufinden, was gerade geschieht.
Hier ist eine schnell gestrichelte Version von dem, was ich denke, Sie versuchen zu tun. Ich würde es auf diese Weise nicht tun, aber ich habe die minimalen Änderungen vorgenommen, damit es funktioniert:
HTML:
<form action="http://www.google.com/search"
method="GET" target="_blank"
onsubmit="return checknewaccount()">
<input type="text" id="email" name='q' onblur="emailvalid()">
<input type="text" id="username" onblur="checkname()" >
<input type="password" id="password" onkeyup="passwordcheck()">
<input type="submit" value="New">
</form>
Hinweise dazu:
- Als Basiclife pointed out, Ihre
form
Code hat Probleme. Diese sind oben festgelegt.
- Oben habe ich
action="http://www.google.com/search"
verwendet, aber natürlich für Sie wäre es action="accountcode.php"
(oder zumindest, ich denke, es wäre).
- Verwenden Sie
onsubmit
für den Formularübergabe-Handler, nicht onclick
auf die Schaltfläche Senden. Sie können eine Formularübergabe nicht zuverlässig über die Schaltfläche onclick
des Absenders bannen.
- In
onsubmit
, stellen Sie sicher, Sie verwenden return
— z.B. onsubmit="return checknewaccount()"
, nicht onsubmit="checknewaccount()"
—, weil wir das Ereignis Zeug sieht den Rückgabewert überprüfen wollen. Es ist uns egal, ob der Event-Stuff den Rückgabewert unserer anderen Checks nicht anzeigt (onblur="emailvalid()"
), aber wenn wir das täten, würden wir auch return
s benötigen.
- Nur eines der obigen Felder hat ein
name
Attribut; keiner von euch tut es. Nur Felder mit name
Attributen werden mit Formularen eingereicht. Ich habe nur eine name
für mein Beispiel verwendet, weil ich nur ein Feld an Google senden möchte, aber für Ihre Zwecke werden Sie name
Attribute für alle drei Felder wünschen. This brief article hat eine Diskussion von id
vs name
und was sie sind. Du willst manchmal beides.
- Ich habe die Attribute in allen Kleinbuchstaben, was Best Practice (und erforderlich, wenn Sie XHTML verwenden wollen).
- Allerdings habe ich die
/
von den Enden der inputs
entfernt. Dies ist ein wenig off-topic, aber auf der offensichtlichen Ebene, an der Sie arbeiten, wollen Sie nicht versuchen, XHTML zu verwenden, verwenden Sie HTML. Die korrekte Verwendung von XHTML ist sowohl in der Authoring- als auch in der Serverkonfiguration technisch schwierig, und selbst dann muss es dem IE als Tag-Suppe serviert werden oder es wird nicht richtig funktionieren. XHTML hat seinen Platz, aber in den allermeisten Fällen gibt es keinen Grund, es zu benutzen.
- Mit dem oben genannten kombiniert mit dem JavaScript unten, gibt es keinerlei Zweck für die Handler auf den einzelnen Feldern. Ich habe sie jedoch verlassen, weil ich davon ausgehe, dass Sie mehr tun als nur die Schecks unter —, es gibt ein Beispiel weiter unten, das diese Handler zeigt, die etwas Nützliches tun.
JavaScript:
function checknewaccount() {
return emailvalid() && checkname() && passwordcheck();
}
function emailvalid() {
var element;
// Get the email element
element = document.getElementById('email');
// Obviously not a real check, just do whatever your condition is
return element.value.indexOf('@') > 0;
}
function checkname() {
var element;
// Get the username element
element = document.getElementById('username');
// Obviously not a real check, just do whatever your condition is
return element.value.length > 0;
}
function passwordcheck() {
var element;
// Get the username element
element = document.getElementById('password');
// Obviously not a real check, just do whatever your condition is
return element.value.length > 0;
}
Live copy
Dinge etwas ändern, wenn die emailvalid
, et. Al., Werden Funktionen, etwas zu tun wissen zu lassen, der Benutzer die Felder sind ungültig, wie ihre Etiketten hervorzuheben:
HTML:
<form action="http://www.google.com/search"
method="GET" target="_blank"
onsubmit="return checknewaccount()">
<label>Email:
<input type="text" id="email" name='q' onblur="emailvalid()"></label>
<br><label>Username:
<input type="text" id="username" onblur="checkname()" ></label>
<br><label>Password:
<input type="password" id="password" onkeyup="passwordcheck()"/></label>
<br><input type="submit" value="New">
</form>
JavaScript:
function checknewaccount() {
var result;
// Because we're actually doing something in each of the
// three functions below, on form validation we want to
// call *all* of them, even if the first one fails, so
// they each color their field accordingly. So instead
// of a one-liner with && as in the previous example,
// we ensure we do call each of them:
result = emailvalid();
result = checkname() && result;
result = passwordcheck() && result;
return result;
}
function emailvalid() {
var element, result;
// Get the email element
element = document.getElementById('email');
// Obviously not a real check, just do whatever your condition is
result = element.value.indexOf('@') > 0;
// Update our label and return the result
updateLabel(element, result);
return result;
}
function checkname() {
var element, result;
// Get the username element
element = document.getElementById('username');
// Obviously not a real check, just do whatever your condition is
result = element.value.length > 0;
// Update our label and return the result
updateLabel(element, result);
return result;
}
function passwordcheck() {
var element, result;
// Get the username element
element = document.getElementById('password');
// Obviously not a real check, just do whatever your condition is
result = element.value.length > 0;
// Update our label and return the result
updateLabel(element, result);
return result;
}
function updateLabel(node, valid) {
while (node && node.tagName !== "LABEL") {
node = node.parentNode;
}
if (node) {
node.style.color = valid ? "" : "red";
}
}
Live copy
Ok Entschuldigung, ich habe meinen Code in der Frage aufgeräumt und ich hoffe es macht für jeden mehr Sinn. Entschuldigung, früher. – Siriss
handy hinweis, wenn sie 'code schnipsel' in kommentare markieren möchten, verwenden sie einen backtick' (links von 1 auf kbd) vor und nach code – Basic