0
votes

TypeError non capturé: ne peut pas lire la propriété 'fname' de non défini à Fillinfo ()

Le titre dit à peu près tout.

Je fais un formulaire qui retournera votre prénom et votre nom de famille avec ville dans une citation en utilisant div clas = "puits". Je suis maintenant coincé pendant quelques heures en essayant de comprendre ce que je fais mal. xxx

et dans le corps est: xxx

Je m'attends à écrire la citation lorsque je clique sur le bouton Soumettre, mais en retour, je reçois ceci:

Company TypeError: impossible de lire la propriété 'fname' de non définie À Fillinfo (choses que je mets dans les intrants Nom, ville) à htmlbuttonelement.onclick (choses que je mets dans les entrées, ville)

javascript html css forms

0 commentaires

4 Réponses :

2
votes

Je pense que vous venez de tromper le nom de formulaire

Votre code HTML: Signupform

Votre code JavaScript: Signupform

Je l'ai réparé et cela a fonctionné pour moi.

0 commentaires

0
votes

J'ai utilisé formdata code> a > Pour obtenir un objet code> objet code>, puis form.get (nom) code> pour obtenir le contenu. C'est un moyen plus élégant d'obtenir votre contenu. em>

J'ai également remplacé votre bouton code> avec un Type d'entrée = "bouton" code>, car il a provoqué une actualisation de la page. P>

Remarque: il ne fonctionne pas sur IE & Safari pour iOS em> p>

p>



   <div class="heading2">
        <div class="container2">
            <p>Do you want to travel troughout space? Then fill out our form!</p><br>
            <form name="SignUpForm" method="get">
                <input type="text" name="fname" placeholder="First name" required><br>
                <input type="text" name="sname" placeholder="Last name" required><br>
                <input type="text" name="city" placeholder="City" required><br><br>
                <div id="info" class="well"></div>
                <input type="button" class="otherpage" onclick="FillInfo();" value="Submit" /><br><br>
                <a href="Mainpage.html" class="BeginLink">Return</a>
            </form>  
       </div>      
    </div>

0 commentaires

0
votes

pourquoi? Ces questions continuent à mettre en place des erreurs code> non définies sans définition dans JavaScript lors de l'accès au DOM code>. Veuillez vous assurer que le DOM code> est prêt avant d'y accéder. Il suffit de mettre vos scripts après que votre HTML ne vous assure pas de cela.

Bien que le nom "Signupform" vous donnera des erreurs et est corrigé ici, cela ne résout pas tout le problème. Différents vitesses et mécanismes de vitesses et de navigateurs de réseau peuvent vous donner une erreur de propriété code> indéfinie (code> non définie si vous ne vous assurez pas que le modèle d'objet de document (DOM) est prêt avant d'accéder aux éléments du document HTML. P>

<script> /* get info from inputs and add it to a quote. */
    window.onload = function () {
        function FillInfo(){
            var fname = document.forms ["SignUpForm"] ["fname"].value;
            var sname = document.forms ["SignUpForm"] ["sname"].value;
            var city = document.forms ["SignUpForm"] ["city"].value;


            document.getElementById("info").innerHTML =  "Thank you" + " " + fname + " " + sname + "from" + " " + city + "." + " " + "You are now being considered as our next adventurer. Good luck!";
        }
    });
</script>

0 commentaires

-1
votes

Je viens de modifier le code, il fonctionne dans tous les navigateurs:

    <script> /* get info from inputs and add it to a quote. */
    function FillInfo(){
    let form = document.querySelector('form');

     var fname = form.elements["fname"];
     var sname = form.elements["sname"];
     var city = form.elements["city"];

     document.getElementById("info").innerHTML =  "Thank you" + " " + fname.value + " " + sname.value + " from " + " " + city.value + "." + " " + "You are now being considered as our next adventurer. Good luck!";
      return false;
    }
</script>

<div class="heading2">
    <div class="container2">
        <p>Do you want to travel troughout space? Then fill out our form!</p><br>
        <form name="SignUpForm" onsubmit="return validateForm()" method="get">
            <input type="text" name="fname" placeholder="First name" required><br>
            <input type="text" name="sname" placeholder="Last name" required><br>
            <input type="text" name="city" placeholder="City" required><br><br>
            <div id="info" class="well"></div>
            <button class="otherpage" type="button" onclick="FillInfo();">Submit</button><br><br>
            <a href="Mainpage.html" class="BeginLink">Return</a>
        </form>
    </div>
</div>

0 commentaires