quelle est la nécessité du mot-clé "return" explicite lors de l'utilisation de onsubmit dans un formulaire utilisant Javascript ?

Question

quelle est la nécessité du mot-clé "return" explicite lors de l'utilisation de onsubmit dans un formulaire utilisant Javascript ?

Demandé el 3 de Octobre, 2011: Quand la question a-t-elle été
726 affichage: Nombre de visites la question a
4 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

J'ai une expérience de la programmation en C/C++ et, alors que j'apprenais le Javascript par le biais des pages Web @3C sur le JS, j'ai trouvé ce bout de code -

<html>
<head>
<script type="text/javascript">
function validateForm()
{
var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }
}
</script>
</head>

<body>
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post">
Email: <input type="text" name="email">
<input type="submit" value="Submit">
</form>
</body>

Eh bien, je ne sais pas si j'ai manqué une de leurs leçons précédentes ; je suis confus sur le "retour" utilisé dans la ligne -

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post">

Ma question - Depuis que le " onsubmit " dans la ligne ci-dessus lors de l'appel de la fonction " validateForm() "Quelle est la signification de ce mot-clé de retour explicite ? Je constate qu'en supprimant le mot-clé return, et en exécutant le code ci-dessus (comme - onsubmit = "validateForm();" ) fonctionne, mais même si une erreur d'entrée est présente, le formulaire est finalement soumis après l'affichage du message d'avertissement.

Pourriez-vous nous éclairer sur l'utilisation de ce mot clé "return" dans ce scénario ?

De plus, je trouve qu'il y a beaucoup d'écart dans la façon dont Javascript est écrit, compte tenu de mon expérience en c/c++ suis-je seul ici :)

Merci !

Demandé el 3 de Octobre, 2011 par arun nair

Answer 1

4 Réponses

Answer 2

3voto

gion_13 Points 15594

Si la fonction retourne false, alors l'événement est annulé.

onsubmit="return validateForm();"

est en quelque sorte équivalent à

onsubmit="if(!validateForm()) stop the event"

Bien sûr, il existe d'autres méthodes (plus propres) pour arrêter la propagation de l'événement :

function stopEvent(event){
    if(event.preventDefault)
         event.preventDefault();
    if(event.stopPropagation)
         event.stopPropagation();
    event.cancelBubble = true;
}

et ensuite l'utiliser dans un gestionnaire d'événements :

onsubmit = function(e){
    if(!validateForm())
        stopEvent(e);
}

Répondu el 3 de Octobre, 2011 par gion_13 (15594 Points )

Answer 3

3voto

duri Points 8246

OK, il semble que certaines réponses soient trompeuses, je vais donc essayer de fournir une explication. La notation <element onsubmit="handler_body"> se traduit par quelque chose comme :

element.onsubmit = function (event) {
    with (document) {
        with (this) {
            handler_body
        }
    }
};

(Nous ignorerons le with -mais ce n'est pas important ici). Maintenant, considérez le validateForm() les fonctions de retour false . Si vous utilisez onsubmit="return validateForm()" ce qui, par la suite, se transforme évidemment en onsubmit="return false" votre gestionnaire deviendra

element.onsubmit = function () {
    return false;
};

Lorsque le submit est déclenché (c'est comme si le navigateur appelait en interne l'événement element.onsubmit() ), element.onsubmit() renvoie à false et donc la valeur par défaut est supprimée.

Cependant, si vous utilisez simplement onsubmit="validateForm();" le gestionnaire d'événement ressemblerait à

element.onsubmit = function () {
    false;
};

Dans ce cas, false est juste une déclaration. element.onsubmit() ne renvoie rien, et renvoyer undefined du gestionnaire d'événements n'est pas suffisant pour empêcher le comportement par défaut.

@Simeon a dit que "Le retour en HTML n'est pas nécessaire." mais il utilise aussi return false dans son code.

Répondu el 3 de Octobre, 2011 par duri (8246 Points )

Answer 4

1voto

Simeon Points 3750

Le site return en HTML n'est pas nécessaire. Pour mémoire, attacher l'événement de manière programmatique est à la fois plus beau et plus puissant :

<html>
    <head>
    <script type="text/javascript">

        var myForm = document.getElementById("myForm");

        myForm.onsubmit = function() {
            var x = myForm["email"].value;
            var atpos = x.indexOf("@");
            var dotpos = x.lastIndexOf(".");

            if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length) {
                alert("Not a valid e-mail address");
                return false;
            }
        };
    </script>
    </head>
    <body>
        <form id="myForm" action="demo_form.asp" method="post">
            <label>
                Email:
                <input type="text" name="email">
            </label>
            <input type="submit" value="Submit">
        </form>
    </body>
</html>

Répondu el 3 de Octobre, 2011 par Simeon (3750 Points )

Answer 5

1voto

arun nair Points 709

Je crois que tout le monde a presque répondu à la question, mais de manière différente. Merci à tous.

J'ai lu par hasard un excellent article en ligne, qui explique magnifiquement ce qui se passe en réalité, principalement dans les coulisses, en utilisant un exemple qui ressemble beaucoup à la question que j'avais postée.

J'ai pensé que cela pourrait être utile à tous ceux qui pourraient être confrontés à ce problème à l'avenir.

Lien vers l'article- http://www.quirksmode.org/js/events_early.html Lisez la section "Prévenir les défauts" de la page.

--arun nair

Répondu el 9 de Octobre, 2011 par arun nair (709 Points )

quelle est la nécessité du mot-clé "return" explicite lors de l'utilisation de onsubmit dans un formulaire utilisant Javascript ?

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

quelle est la nécessité du mot-clé "return" explicite lors de l'utilisation de onsubmit dans un formulaire utilisant Javascript ?

Réponses

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: