0

Preciso fazer uma aplicação em javascript/jquery/html que conte os cliques do usuário no botão e quando o contador chegar em 10 trave o botão e exibe um alert, não sei porque não está exibindo. Alguém sabe?

<head>

    <title>Página</title> <!-- Add page title -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!-- add Jquery CDN -->

    <link href src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" media="screen"></script> <!-- add bootstrap css CDN --> 
</head>


<body>


    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <!-- add Bootstrap CDN -->

    <link href="design.css" rel="stylesheet" medi="screen"> <!-- Add css in html -->


    <div class="container">
        <div class="row">
            <div class="col-lg-12 tabela">
                linha azul

            </div>
        </div>
    </div>



    <script type="text/javascript"> // all javascript/jquery code start here

        function add_field() 
    {
        var form = document.getElementsByTagName('form')[0],
        input = document.createElement('textarea');
        input.setAttribute('type', 'textarea');
        input.setAttribute('name', 'item');
        form.appendChild(input);

    };


                function contador() 
    {
        var count = 0;
        count++;

        if(count == 10){
            alert("QWERTY");

        }

    };



    </script>


        <form name="input" method="get">
            <div class="ui-input-text">      
                <div data-role="navbar">
                      <button type="button" onclick="add_field(); contador();">ADD</button><br>
                </div>
            </div>
        </form>


</body>

1
  • 3
    var count = 0; fora da função contador() e já deve funcionar. O problema é que estás a colocar o count = 0 cada vez que a chamavas
    – Miguel
    Commented 23/09/2017 às 19:44

1 Resposta 1

6

O seu count desta forma sempre será 0:

function contador() 
    {
        var count = 0;
        count++;

        if(count == 10){
            alert("QWERTY");

        }

    };

então o correto seria você declará o cont fora da função contador()

   var count = 0;   
 function contador() 
        {

            count++;

            if(count == 10){
                alert("QWERTY");
             document.getElementById('btn').disabled=true;

            }

        };

Veja o seu codigo com a alteração feita. coloque um id para o botão:

function add_field() 
    {
        var form = document.getElementsByTagName('form')[0],
        input = document.createElement('textarea');
        input.setAttribute('type', 'textarea');
        input.setAttribute('name', 'item');
        form.appendChild(input);

    };
    
var count = 0;

function contador() 
    {
        
        count++;

        if(count == 10){
            alert("QWERTY");
   document.getElementById('btn').disabled=true;

        }

    };
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!-- add Jquery CDN -->

    <link href src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" media="screen">



    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <!-- add Bootstrap CDN -->

    <link href="design.css" rel="stylesheet" medi="screen"> <!-- Add css in html -->


    <div class="container">
        <div class="row">
            <div class="col-lg-12 tabela">
                linha azul

            </div>
        </div>
    </div>




        <form name="input" method="get">
            <div class="ui-input-text">      
                <div data-role="navbar">
                      <button type="button" onclick="add_field(); contador();" id="btn">ADD</button><br>
                </div>
            </div>
        </form>


</body>

0

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .