Maison > Article > développement back-end > js exemple de code pour implémenter une fonction de connexion simple

js exemple de code pour implémenter une fonction de connexion simple

不言original: 2018-05-04 15:08:572623parcourir

Cet article présente principalement l'exemple de code de js pour implémenter une fonction de connexion simple. Il a une certaine valeur de référence. Maintenant, je le partage avec tout le monde. Les amis dans le besoin peuvent s'y référer

Copier le code<.> Le code est le suivant :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Login.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <script type="text/javascript">
      function checkuser() {
         if($(&#39;uname&#39; == "lala") && $(&#39;pwd&#39;) == "123") {
           return true;
         }else {
            return false;
         }
      }

      function $(id) {
        return document.getElementById(id).value;
      }
     </script>
  </head>

  <body>
    <form action="ok.html">
      u:<input type="text" id="uname"/><br>
      p:<input type="password" id="pwd"/><br>
      <input type="submit" value="登录" onclick="return checkuser()"/>
    </form>
  </body>
</html>

Voici la page de connexion La connexion est réussie uniquement lorsque le nom d'utilisateur est lala et le mot de passe est 123. Utilisez return lors de l'événement onclick pour empêcher la page de sauter lorsque le nom d'utilisateur et le mot de passe saisis ne correspondent pas. La page de connexion réussie contient les secondes d'attente, le code est :

Copiez le code Le code est le suivant :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ok.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <script type="text/javascript">
        function tiao() {
          clearInterval(mytime);
          window.open("manage.html","_self");
        }

        setTimeout("tiao()",5000);

        function changeSec() {
           //得到myspan值
           $(&#39;myspan&#39;).innerText=$(&#39;myspan&#39;).innerText-1;
        }

         function $(id) {
        return document.getElementById(id);
      }
        var mytime = setInterval("changeSec()",1000);
    </script>
  </head>

  <body>
    登录成功，<span id="myspan">5</span>秒后自动跳转到管理页面
  </body>
</html>

La clé réside dans l'utilisation de plusieurs fonctions. setTimeout("tiao()",5000); La fonction consiste à ouvrir la page, à attendre 5 secondes et à appeler la fonction tiao(). La fonction setInterval("changeSec()",1000); appelle la fonction changeSec() toutes les 1 seconde. Ceci termine la fonction de connexion simple.

Recommandations associées :

Explication détaillée des étapes pour implémenter l'algorithme de mise en cache dans JS

JS pour implémenter la loterie de la grande roue

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Comment installer PHPUnit dans l'environnement CentOSArticle suivant：Comment installer PHPUnit dans l'environnement CentOS

Articles Liés

Voir plus