Problems calling a Javascript function in an html buttom!

Asked

Viewed 33 times

0

I created two functions in js for two buttons in HTML, one reads the name of the visitors of the site and the other shows the name of the visitors who already read, as follows below: 

var nomearray= [ ];

function nome(){

  var nome = prompt("Olá viajante, digite seu nome:")
  var cont = cont + 1;
  nomearray[0 + cont] = nome;  
}

function totalVisitantes(){

  for(var i=0; i<=cont;i++){
    alert(nomearray[i])
  }
}

Obs: i declared the array outside of the functions to be global and to be accessed in the other function.

In html, I called them so: 

< button onclick="nome()" >Qual seu nome?< /button >

< button onclick="totalVisitantes()">Visitantes< /button >

Obs: the buttons are in the < head >.

What would be the reason for the button’s not able to call the functions? I gradi the help of all beforehand. In case my explanation was confused, I apologize. 

<html >
    <head >
        <title>Dark Site</title >
        <link rel="stylesheet" href="estilo1.css" >
        <script type="text/javascript" scr="script1.js"></script >

        <script language="javascript"> 
            function setCookie(nome, valor, dias){ 
            diasms = (new Date()) .getTime() + 1000 * 3600 * 24 * dias; 
            dias = new Date(diasms); 
            expires = dias.toGMTString(); 
            document.cookie = escape(nome) + "=" + escape(valor) + "; expires=" + expires; 
            } 
            </script >

    </head >
        <body >
                <button onclick="nome()">Qual seu nome? </button >

                <button onclick="totalVisitantes()">Visitantes</button >

            <h1><font color="white"><center>Historias Macabras</center ></font></h1>

            <script language="javascript" >
                if (!document.cookie){
                setCookie("cookie", "1", 365);
                document.write("<font face='verdana' size='1'>Visitas : 1</font>");
                } else {
                var cont = document.cookie;
                var dividindo = cont.split("=");
                //document.write(dividindo[1]);
                var numero = parseInt(dividindo[1]);
                var soma = numero + 1;
                document.write("<font face='verdana' size='1'>Visitas : " + soma + "</font>");
                setCookie("cookie", soma, 365);


                }
                </script> 

            <style type="text/css">
                img{border-radius: 20px;}
                </style>

            <h2><a  href="https://maringapost.com.br/ahduvido/10-historias-classicas-da-creepypasta/"><center><font color="red">A Estátua</font></center></a></h2>

            <table>
                <tr>

                <td><img src="1.jpg" width="300" height="250" alt="A Estátua" /></td>
                <td><font color="grey"><center></center>"texto"</center></font></td >

                </tr >
            </table>

            <h2><a  href="https://maringapost.com.br/ahduvido/10-historias-classicas-da-creepypasta/"><center><font color="red">A Carta</font></center></a></h2>

            <table>
                <tr>
                    <td><img src="2.jpg" width="300" height="250" alt="O Açogueiro"> </td>
                    <td><font color="grey"><center></center>"texto”</center></font></td>
                </tr >
            </table >

            <table >
                <tr>
                    <h2><a  href="https://maringapost.com.br/ahduvido/10-historias-classicas-da-creepypasta/"><center><font color="red">Espelhos</font></center></a></h2>
                    <td><img src="3.jpg" width="300" height="250" alt="O Açogueiro"></td>
                    <td><font color="grey"><center></center>"texto”</center></font></td>
                </tr>
            </table>

            <table >
                <tr>
                    <h2><a  href="https://maringapost.com.br/ahduvido/10-historias-classicas-da-creepypasta/"><center><font color="red">O celular</font></center></a></h2>
                    <td><img src="4.jpg" width="300" height="250" alt="O Celular Novo"></td>
                    <td><font color="grey"><center></center>"texto".</center></font></td>
                </tr>
            </table >

            <center><table >
                <tr>
                    <td><embed src="song1.mp3" width="50" height="90" autostart="true"></td>
                        <td><h2><a href="beguin3.html">images</a>2</h2></td>
                        <td><h2><a href="file:///C:/Users/douglas/Desktop/DarkSite/beguin1.html">home</a></h2></td>

                     <a href="file:///C:/Users/douglas/Desktop/DarkSite/beguin2.html">1</a></h3></td>
                </tr>
            </table></center>
        </body>
</html>

Note: please ignore the texts.

javascript html
  • 1

    The problem was that the js script was not in html

  • Please avoid long discussions in the comments; your talk was moved to the chat (click on the link if you want to continue)

1 answer

1


As you can see in my example, your code is working normally, I just made some changes in points that were not correct:

1 - You have to declare the variable cont also out of function nome(), because it is using in totalVisitants().

2 - It is not very indicated to use variable name with the same function name as you did with name.

3 - Like nomearray is a vector, you will have to use the method push() to keep the values.

var nomearray = [];
var cont = 0;

function nome() {

  var nomes = prompt("Olá viajante, digite seu nome:");
  nomearray.push(nomes);
  cont++;
  console.log(cont);
}

function totalVisitantes(){

  for(var i=0; i<cont ;i++){
    alert(nomearray[i]);
  }
}
<button onclick="nome()">Qual seu nome? </button >

<button onclick="totalVisitantes()">Visitantes</button >

Browser other questions tagged javascript html

You are not signed in. Login or sign up in order to post.