Validation does not work jquery

Asked

Viewed 62 times

3

Colleagues

I made this script to validate the access, but it’s not working. Can anyone tell me where the error is?

<html>
    <head>
        <title>title</title>
    </head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js">
<script type="text/javascript">
 $('#submit').submit(function(){
      alert('aqui');

      return false;
    });
  </script>
    <body>
<div id="success"></div>
<form  id="contact-form" action="#" method="post">
    <input name="Email" placeholder="Login" id="login" type="text" required >
    <input name="Password" placeholder="Senha" id="senha" type="password" required>
    <div class="sign-up">
      <div align="center">
          <button type="submit" value="Acessar" id="submit"/>Acessar</button>
        </div>
    </div>
</form>
    </body>
</html>
jquery

1 answer

3


You have to put the <script> after HTML, so jQuery cannot find the button since its HTML has not yet been read.

Note also that:

  • your tag script loading jQuery has to be closed, missing the </script>
  • the event should be click and not submit. If instead of $('#submit').submit(function(){ put this Handler Vent on form then you should use the submit.

An alternative is to join a function to run only when the page has loaded, in which case it would be like this:

<html>

<head>
  <title>title</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
  <script type="text/javascript">
    $(function() {
      $('#submit').click(function() {
        alert('aqui');
        return false;
      });
    });
  </script>
</head>


<body>
  <div id="success"></div>
  <form id="contact-form" action="#" method="post">
    <input name="Email" placeholder="Login" id="login" type="text" required>
    <input name="Password" placeholder="Senha" id="senha" type="password" required>
    <div class="sign-up">
      <div align="center">
        <button type="submit" value="Acessar" id="submit">Acessar</button>
      </div>
    </div>
  </form>
</body>

</html>

  • 1

    I put it after HTML and it worked. Learning from the bugs ; ) . Thanks again Sergio.

Browser other questions tagged jquery

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