web-dev-qa-db-fra.com

javascript onsubmit ne fonctionne pas

J'essaie de faire fonctionner une fonction javascript en soumettant le formulaire, la fonction ne semble pas fonctionner. Quelqu'un peut-il aider?

<html>
<head>
    <script>
        function upload(){
                alert("I am an alert box!");
        }
     </script>
</head>
<body>
    <form enctype="multipart/form-data" method="post" onsubmit="return upload();">
    <input type="file" name="file">
    <input type="submit" name="upload" value="Datei hochladen">
    </form>
</body>
</html>
javascriptonsubmit
13
Stoffl

Lorsque vous attachez le gestionnaire d'événements à l'élément de formulaire, la portée du gestionnaire d'événements est le formulaire et non la fenêtre

<form enctype="multipart/form-data" method="post" onsubmit="return upload(this);">

<script>
    function upload(scope) {
        console.log(scope); // The passed scope from the event handler is
    }                       // the form, and not window
</script>

Comme les éléments d'entrée à l'intérieur d'un formulaire sont attachés en tant que propriétés à l'objet de formulaire, où le nom est la clé, appeler upload() dans le gestionnaire d'événements, où la portée est le formulaire, équivaudrait à appeler form.upload(), mais le formulaire a déjà un élément avec ce nom, donc form.upload est le bouton de téléchargement, pas la fonction upload() dans la portée globale.

Pour le résoudre, renommez la fonction ou l'élément

<html>
<head>
    <script>
        function upload(){
                alert("I am an alert box!");
        }
     </script>
</head>
<body>
    <form enctype="multipart/form-data" method="post" onsubmit="return upload();">
    <input type="file" name="file">
    <input type="submit" name="upload2" value="Datei hochladen">
    </form>
</body>
</html>

[~ # ~] violon [~ # ~]

22
adeneo