jquery實現使用者登陸介面技術解答-js教程-PHP中文網

首頁

web前端

js教程

jquery實現使用者登陸介面技術解答

小云云

Dec 29, 2017 am 10:51 AM

jquery 介面登陸

本文主要為大家帶來一篇jquery實作使用者登陸介面(範例講解)。小編覺得蠻不錯的，現在就分享給大家，也給大家做個參考。一起跟著小編過來看看吧，希望能幫助大家。

實例如下所示：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
  </head>
  <script src="js/jquery-1.8.0.min.js"></script>
  <script>
    var cnresu = false;
    $(function(){
      $("input[name=&#39;uname&#39;]").blur(function(){//blur从链接上移开焦点(鼠标离开框时)
        var unamestr = $(this).val();
        var regstr = /^[\u4e00-\u9fa5]{2,4}$/;
        if(!regstr.test(unamestr)){
          $(this).parent().next("dd").html("必须是2-4个汉字");
          cnresu = false;
          return;
        }
        cnresu = true;
      });
      $("input[name=&#39;uname&#39;]").focus(function(){//focus给予链接焦点(鼠标点中框时)
        $(this).css("border","solid 1px #dddddd");
        //$(this).val("");
        $(this).parent().next("dd").html("");
      });
    });
  </script>
  <style>
    #home{
      width: 600px;
      height: 300px;
      margin: auto;
      background-color: #7FFFD4;
    }
    #head{
      padding-top: 20px;
      height: 100px;
    }
    .dl1{
      clear: both;
    }
    .dl1 dt{
      float: left;
      text-align: right;
      width: 150px;
      height: 30px;
      line-height: 30px;
    }
    .dl1 dd{
      float: left;
      height: 30px;
      line-height: 30px;
    }
    #foot{
      text-align: center;
    }
    h1{
      padding-top: 20px;
      text-align: center;
      color: bisque;
    }
  </style>
  <body>
    <p id="home">
      <h1>用户登陆</h1>
      <p id="head">
      <form action="biaodan.html" name="regform" method="post" >
        <dl class="dl1">
          <dt>用户名 : </dt>
          <dd><input type="text" name="uname"/></dd>
          <dd id="erroruname"></dd>
        </dl>
        <dl class="dl1">
          <dt>密码 : </dt>
          <dd><input type="password"/></dd>
          <dd id="errorpass"></dd>
        </dl>
      </p>
        <p id="foot">
          <input type="submit" value="提交"/>
          <input type="reset" value="重置"/>
        </p>
      </form>
    </p>
  </body>
</html>

登入後複製

執行截圖

熱AI工具

熱工具

熱門話題

gmail信箱登陸入口在哪裡

7821

Java教學

1647

CakePHP 教程

1402

Laravel 教程

1300

PHP教程

1238

Related knowledge

企業微信的信箱怎麼登陸 Mar 10, 2024 pm 12:43 PM

企業微信的郵箱怎麼登陸?企業微信APP中是可以登陸郵箱，但是多數的用戶不知道郵箱如何的登陸，接下來就是小編為用戶帶來的企業微信郵箱登陸方法圖文教程，感興趣的用戶快來一起看看吧！企業微信使用教程企業微信的郵箱怎麼登陸1、先打開企業微信APP，進入到主頁最底部【工作台】點擊來專區;2、之後在工作台專區中，選擇其中的【企業郵箱】服務; 3.然後跳到企業信箱功能頁，點選底部的【綁定】或【換一個信箱】;4、最後在下圖所示的頁面輸入【QQ帳號】和【密碼】即可登陸信箱。

Wegame登陸操作太頻繁怎麼解決？ Mar 14, 2024 pm 07:40 PM

Wegame是一款搭配騰訊遊戲使用的軟體，可以透過它來啟動遊戲，獲得加速，而近期有不少用戶在使用的時候出現了登陸操作過於頻繁的提示，面對這個提示，許多用戶都不知道怎麼才能夠成功解決，那麼本期軟體教學就來和大夥分享解決方法，一起來了解看看吧。　　Wegame登陸操作過於頻繁怎麼辦？　　方法一：　　1、先確認一下我們的網路連線是否正常。　　（可以嘗試開啟瀏覽器，看看能不能上網）　　2、如果是網路故障，那麼試著重新啟動路由器、重新連線、重新啟動電腦來解決。　　方法二：　　1、如果網路沒有問題，那麼選擇&

GeForce Experience登入當機[修復] Mar 19, 2024 pm 06:30 PM

本文將引導您解決在Windows11/10上出現的GeForceExperience登入當機問題。通常情況下，這可能是由於不穩定的網路連接、損壞的DNS快取、過時或損壞的圖形卡驅動程式等原因引起的。修復GeForceExperience登入黑畫面在開始之前，請確保重新啟動您的網路連線和電腦。有時候，這個問題可能只是因為臨時問題所引起的。如果您仍遇到NVIDIAGeForceExperience登入黑畫面問題，請考慮採取以下建議：檢查您的internet連線切換到另一個Internet連線停用您的

jQuery中如何使用PUT請求方式？ Feb 28, 2024 pm 03:12 PM

jQuery中如何使用PUT請求方式？在jQuery中，發送PUT請求的方法與發送其他類型的請求類似，但需要注意一些細節和參數設定。 PUT請求通常用於更新資源，例如更新資料庫中的資料或更新伺服器上的檔案。以下是在jQuery中使用PUT請求方式的具體程式碼範例。首先，確保引入了jQuery庫文件，然後可以透過以下方式發送PUT請求：$.ajax({u

word介面變小了怎麼辦 Mar 20, 2024 pm 09:30 PM

我們在使用電腦進行word文檔操作編輯的時候，常常不知道是觸碰到了什麼位置，介面忽然變得很小，有時候word文檔裡的文字都看不太清楚了。有人可能遇到這樣的問題會驚慌失措了，以為是電腦出了故障，其實，這只是因為你碰到了某種設置，將顯示做了調整。那麼，如果不小心改變了介面顯示的大小，該怎麼恢復和調整呢？ word介面變小了怎麼辦呢？下邊，我們就分享幾種方式加以解決，希望你遇到這樣的問題的時候能夠輕鬆應付和處理。首先，我們新建並開啟一個Word文檔，進行簡單的編輯操作，以便於展示操作步驟。在下圖中

Linux Debian11伺服器安裝SSH，建立新使用者並允許SSH遠端登錄，及SSH安全登入設定！ Mar 01, 2024 pm 07:16 PM

在Debian11伺服器上安裝SSH並建立新使用者允許SSH遠端登入的步驟如下：步驟1：安裝SSH為了安裝SSH伺服器，您需要以root使用者或具有sudo特權的使用者身分登入您的Debian11伺服器。在終端機中執行以下指令來安裝SSH伺服器：sudoaptupdatesudoaptinstallopenssh-server步驟2：建立新使用者要建立一個新用戶，您可以使用adduser指令。將下面的命令替換為您想要的使用者名稱：sudoaddusernew_username系統會提示您設定新使用者的密碼和其

jQuery小技巧：快速修改頁面所有a標籤的文本 Feb 28, 2024 pm 09:06 PM

標題：jQuery小技巧：快速修改頁面所有a標籤的文字在網頁開發中，我們經常需要對頁面中的元素進行修改和操作。使用jQuery時，有時候需要一次修改頁面中所有a標籤的文字內容，這樣可以節省時間和精力。以下將介紹如何使用jQuery快速修改頁面所有a標籤的文本，同時給出具體的程式碼範例。首先，我們需要引入jQuery庫文件，確保在頁面中引入了以下程式碼：&lt

使用jQuery修改所有a標籤的文字內容 Feb 28, 2024 pm 05:42 PM

標題：使用jQuery修改所有a標籤的文字內容jQuery是一款受歡迎的JavaScript庫，被廣泛用於處理DOM操作。在網頁開發中，經常會遇到需要修改頁面上連結標籤（a標籤）的文字內容的需求。本文將介紹如何使用jQuery來實現這個目標，並提供具體的程式碼範例。首先，我們需要在頁面中引入jQuery庫。在HTML檔案中加入以下程式碼：

See all articles

jquery實現使用者登陸介面技術解答

熱AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

熱門文章

熱工具

記事本++7.3.1

SublimeText3漢化版

禪工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

熱門話題