Hoe valideer je e-mailadressen met Javascript (zonder JQuery)?

Ik probeer een e-mailadresvalidatie uit te voeren voor een invoertekstveld, maar het moet alleen indienen als het item niet nul is en het @ char bevat

Voorbeeld 1 is degene die werkt, maar het sluit de behoefte aan de @ char uit

function emailvalidation() {
var x=document.forms["input"]["email"].value;

if (x==null || x=="") {
    alert("Input email address, please!");
return false
}

Voorbeeld 2 dat niet werkt, maar hoe ik me voorstel dat het zou worden geschreven

    function emailvalidation() {
var x=document.forms["input"]["email"].value;
var email = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

if (x<>null || x<>"" && x.value.match(email)) {
    alert("Input email address, please!");
return true
} else {
    alert("Input email address, please!");
return false
}
}

Heeft iemand ideeën? Maar bedankt, bij voorkeur zonder JQuery! Bedankt!

0
Wat betekent "niet werken" betekent? Krijg je valse positieven?
toegevoegd de auteur Cristik, de bron
Als u alleen het @ -teken wilt, waarom dan niet x.indexOf ('@')! = -1 gebruiken? Uw tweede functie zou waarschijnlijk x.match (email) moeten hebben in plaats van x.value.match (email) omdat x reeds de waarde .
toegevoegd de auteur putvande, de bron
Als u alleen het @ -teken wilt, waarom dan niet x.indexOf ('@')! = -1 gebruiken? Uw tweede functie zou waarschijnlijk x.match (email) moeten hebben in plaats van x.value.match (email) omdat x reeds de waarde .
toegevoegd de auteur putvande, de bron
Als u alleen het @ -teken wilt, waarom dan niet x.indexOf ('@')! = -1 gebruiken? Uw tweede functie zou waarschijnlijk x.match (email) moeten hebben in plaats van x.value.match (email) omdat x reeds de waarde .
toegevoegd de auteur putvande, de bron
Als u zegt dat het niet werkt, heeft u voorbeelden die niet in het tweede voorbeeld passen? Heb je geprobeerd om <> te vervangen door ! == ? Werkt in deze fiddle . U wilt de || wijzigen naar een && ook. Ik moest de .value verwijderen uit x.value.match() omdat ik een tekenreeks gebruik in plaats van het element.
toegevoegd de auteur adamdc78, de bron
Als u zegt dat het niet werkt, heeft u voorbeelden die niet in het tweede voorbeeld passen? Heb je geprobeerd om <> te vervangen door ! == ? Werkt in deze fiddle . U wilt de || wijzigen naar een && ook. Ik moest de .value verwijderen uit x.value.match() omdat ik een tekenreeks gebruik in plaats van het element.
toegevoegd de auteur adamdc78, de bron
Als u zegt dat het niet werkt, heeft u voorbeelden die niet in het tweede voorbeeld passen? Heb je geprobeerd om <> te vervangen door ! == ? Werkt in deze fiddle . U wilt de || wijzigen naar een && ook. Ik moest de .value verwijderen uit x.value.match() omdat ik een tekenreeks gebruik in plaats van het element.
toegevoegd de auteur adamdc78, de bron
u kunt een geldige Regex voor e-mailgebruik valideren. u kunt hiernaar verwijzen [post] [1] [1]: stackoverflow.com/questions/46155/…
toegevoegd de auteur Ari Djemana, de bron
u kunt een geldige Regex voor e-mailgebruik valideren. u kunt hiernaar verwijzen [post] [1] [1]: stackoverflow.com/questions/46155/…
toegevoegd de auteur Ari Djemana, de bron

12 antwoord

Nog een e-mailvalidatie.

function isValidEmailAddress(emailAddress) {
            var pattern = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i);
            return pattern.test(emailAddress);
        };
1
toegevoegd

Nog een e-mailvalidatie.

function isValidEmailAddress(emailAddress) {
            var pattern = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i);
            return pattern.test(emailAddress);
        };
1
toegevoegd

Nog een e-mailvalidatie.

function isValidEmailAddress(emailAddress) {
            var pattern = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i);
            return pattern.test(emailAddress);
        };
1
toegevoegd

Op basis van uw eerste script en vereisten, één oplossing zonder regex en één met.

Merk op dat een tekstinvoerveld alleen tekenreeksen retourneert. E-mailadressen moeten iets bevatten vóór de @ , dus we controleren of een @ verschijnt na het eerste teken (met indexOf dat we niet nodig hebben een regex). Als we de @ hebben gevonden, betekent dit dat de tekenreeks niet leeg was !!
Als de @ zich op dezelfde positie bevindt als de laatste @ en deze positie is kleiner dan de totale tekenreekslengte, geeft dit ons een true of false waarde, die we direct kunnen retourneren .
Als aan geen van de drie voorwaarden is voldaan, stellen we alert in ons foutbericht in. alert retourneert undefined (wat op zichzelf false betekent in javascript, maar) die we forceren naar een boolean false met behulp van dubbel niet !! en return die waarde.

Het tweede voorbeeld volgt dezelfde logica, maar gebruikt een regex.

<div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false"> <div class="snippet-code">

function emailvalidation(){ //without regex
  var s=document.forms.input.email.value
  ,   x=s.indexOf('@');
  return( x>0 && x===(x=s.lastIndexOf('@')) && x
<form name="input">
  <input name="email" type="text" />
</form>
<button onclick="alert(emailvalidation())">test</button>
</div> </div>

Laatste opmerking, het is goed dat je liberaal bent in het accepteren van e-mailadressen , omdat het proberen om goed werk af te leveren in regex lang en moeilijk is, zie bijvoorbeeld deze regex: http://www.ex-parrot.com/pdw/Mail-RFC822-Address.html
Er is eenvoudigweg geen 100% betrouwbare manier om een ​​geldig e-mailadres te bevestigen, behalve het verzenden van een e-mail aan de gebruiker en wachten op een antwoord. Zie ook https://softwareengineering.stackexchange.com/ vragen/78353/how-ver-moet-one-take-e-mail-adres-validatie
Als u do probeert om 'geldige e-mailadressen' te regexen, laat u uw werkgever weten dat u hem gaat kosten bedrijf/klanten/cash !!!

0
toegevoegd

Op basis van uw eerste script en vereisten, één oplossing zonder regex en één met.

Merk op dat een tekstinvoerveld alleen tekenreeksen retourneert. E-mailadressen moeten iets bevatten vóór de @ , dus we controleren of een @ verschijnt na het eerste teken (met indexOf dat we niet nodig hebben een regex). Als we de @ hebben gevonden, betekent dit dat de tekenreeks niet leeg was !!
Als de @ zich op dezelfde positie bevindt als de laatste @ en deze positie is kleiner dan de totale tekenreekslengte, geeft dit ons een true of false waarde, die we direct kunnen retourneren .
Als aan geen van de drie voorwaarden is voldaan, stellen we alert in ons foutbericht in. alert retourneert undefined (wat op zichzelf false betekent in javascript, maar) die we forceren naar een boolean false met behulp van dubbel niet !! en return die waarde.

Het tweede voorbeeld volgt dezelfde logica, maar gebruikt een regex.

<div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false"> <div class="snippet-code">

function emailvalidation(){ //without regex
  var s=document.forms.input.email.value
  ,   x=s.indexOf('@');
  return( x>0 && x===(x=s.lastIndexOf('@')) && x
<form name="input">
  <input name="email" type="text" />
</form>
<button onclick="alert(emailvalidation())">test</button>
</div> </div>

Laatste opmerking, het is goed dat je liberaal bent in het accepteren van e-mailadressen , omdat het proberen om goed werk af te leveren in regex lang en moeilijk is, zie bijvoorbeeld deze regex: http://www.ex-parrot.com/pdw/Mail-RFC822-Address.html
Er is eenvoudigweg geen 100% betrouwbare manier om een ​​geldig e-mailadres te bevestigen, behalve het verzenden van een e-mail aan de gebruiker en wachten op een antwoord. Zie ook https://softwareengineering.stackexchange.com/ vragen/78353/how-ver-moet-one-take-e-mail-adres-validatie
Als u do probeert om 'geldige e-mailadressen' te regexen, laat u uw werkgever weten dat u hem gaat kosten bedrijf/klanten/cash !!!

0
toegevoegd

Op basis van uw eerste script en vereisten, één oplossing zonder regex en één met.

Merk op dat een tekstinvoerveld alleen tekenreeksen retourneert. E-mailadressen moeten iets bevatten vóór de @ , dus we controleren of een @ verschijnt na het eerste teken (met indexOf dat we niet nodig hebben een regex). Als we de @ hebben gevonden, betekent dit dat de tekenreeks niet leeg was !!
Als de @ zich op dezelfde positie bevindt als de laatste @ en deze positie is kleiner dan de totale tekenreekslengte, geeft dit ons een true of false waarde, die we direct kunnen retourneren .
Als aan geen van de drie voorwaarden is voldaan, stellen we alert in ons foutbericht in. alert retourneert undefined (wat op zichzelf false betekent in javascript, maar) die we forceren naar een boolean false met behulp van dubbel niet !! en return die waarde.

Het tweede voorbeeld volgt dezelfde logica, maar gebruikt een regex.

<div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false"> <div class="snippet-code">

function emailvalidation(){ //without regex
  var s=document.forms.input.email.value
  ,   x=s.indexOf('@');
  return( x>0 && x===(x=s.lastIndexOf('@')) && x
<form name="input">
  <input name="email" type="text" />
</form>
<button onclick="alert(emailvalidation())">test</button>
</div> </div>

Laatste opmerking, het is goed dat je liberaal bent in het accepteren van e-mailadressen , omdat het proberen om goed werk af te leveren in regex lang en moeilijk is, zie bijvoorbeeld deze regex: http://www.ex-parrot.com/pdw/Mail-RFC822-Address.html
Er is eenvoudigweg geen 100% betrouwbare manier om een ​​geldig e-mailadres te bevestigen, behalve het verzenden van een e-mail aan de gebruiker en wachten op een antwoord. Zie ook https://softwareengineering.stackexchange.com/ vragen/78353/how-ver-moet-one-take-e-mail-adres-validatie
Als u do probeert om 'geldige e-mailadressen' te regexen, laat u uw werkgever weten dat u hem gaat kosten bedrijf/klanten/cash !!!

0
toegevoegd

You have a couple of logical problems in your solution.
Firstly, the condition is that x is not null and x is not an empty string and x matches the pattern.
Secondly, <> is the wrong comparator for javascript; use != or !==.
Thirdly, as pointed out by putvande x is already the element's value, so x.value.match() is probably causing you issues.

function emailvalidation() {
  var x = document.forms["input"]["email"].value;
  var email = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

  if (x !== null && x !== "" && x.match(email)) {
    return true;
  } else {
    alert("Input email address, please!");
    return false;
  }
}
0
toegevoegd
Ik heb net mijn eigen opmerking geschreven toen ik deze kreeg, heel erg bedankt dat je me veel hebt geleerd! :)
toegevoegd de auteur WorkingScript, de bron

You have a couple of logical problems in your solution.
Firstly, the condition is that x is not null and x is not an empty string and x matches the pattern.
Secondly, <> is the wrong comparator for javascript; use != or !==.
Thirdly, as pointed out by putvande x is already the element's value, so x.value.match() is probably causing you issues.

function emailvalidation() {
  var x = document.forms["input"]["email"].value;
  var email = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

  if (x !== null && x !== "" && x.match(email)) {
    return true;
  } else {
    alert("Input email address, please!");
    return false;
  }
}
0
toegevoegd
Ik heb net mijn eigen opmerking geschreven toen ik deze kreeg, heel erg bedankt dat je me veel hebt geleerd! :)
toegevoegd de auteur WorkingScript, de bron

You have a couple of logical problems in your solution.
Firstly, the condition is that x is not null and x is not an empty string and x matches the pattern.
Secondly, <> is the wrong comparator for javascript; use != or !==.
Thirdly, as pointed out by putvande x is already the element's value, so x.value.match() is probably causing you issues.

function emailvalidation() {
  var x = document.forms["input"]["email"].value;
  var email = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

  if (x !== null && x !== "" && x.match(email)) {
    return true;
  } else {
    alert("Input email address, please!");
    return false;
  }
}
0
toegevoegd
Ik heb net mijn eigen opmerking geschreven toen ik deze kreeg, heel erg bedankt dat je me veel hebt geleerd! :)
toegevoegd de auteur WorkingScript, de bron

Bedankt allemaal hiervoor! De oplossing was een mix van alle antwoorden! Maar hier is de laatste oplossing! Nodig een nieuwe reg expressie en! ==

Maar bedankt allemaal, van een JS-beginner wordt het echt op prijs gesteld

function emailvalidation() {

var x=document.forms["input"]["email"].value;
var email = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

if (x !== null && x !== "" && x.match(email)) {
return true
} else {
    alert("Input email address, please!");
return false
}
}
0
toegevoegd

Bedankt allemaal hiervoor! De oplossing was een mix van alle antwoorden! Maar hier is de laatste oplossing! Nodig een nieuwe reg expressie en! ==

Maar bedankt allemaal, van een JS-beginner wordt het echt op prijs gesteld

function emailvalidation() {

var x=document.forms["input"]["email"].value;
var email = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

if (x !== null && x !== "" && x.match(email)) {
return true
} else {
    alert("Input email address, please!");
return false
}
}
0
toegevoegd

Bedankt allemaal hiervoor! De oplossing was een mix van alle antwoorden! Maar hier is de laatste oplossing! Nodig een nieuwe reg expressie en! ==

Maar bedankt allemaal, van een JS-beginner wordt het echt op prijs gesteld

function emailvalidation() {

var x=document.forms["input"]["email"].value;
var email = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

if (x !== null && x !== "" && x.match(email)) {
return true
} else {
    alert("Input email address, please!");
return false
}
}
0
toegevoegd