ajax例項程式碼及效果

阿新 • • 發佈：2019-01-15

ps：不足之處，請大家多多指教
以下html檔案都要伺服器環境下開啟。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ceshi</title>
    <script type="text/javascript" src="ajax.js"></script>

</head>
<body>
    帳號：<input type="text" id="username" 
>
    密碼：<input type="password" id="password">
    <input type="button" value="提交" onclick="checkname()">
</body>

<script type="text/javascript">
    function checkname() {
        var username = document.getElementById('username').value;
        //1、建立物件
        var xhr = new 
 XMLHttpRequest();
        //2、連線伺服器
        xhr.open('GET','name.json',true);//json資料內容如下圖3

        //3、向伺服器傳送請求
        xhr.send(null);
        //4、請求完成，響應就緒
        xhr.onreadystatechange=function(){
        if (xhr.readyState==4) {
            if (xhr.status==200) {//表示已經獲取到檔案。
                var str = JSON 
.parse(xhr.responseText);//將json資料轉換成js陣列對    
                   alert(str);//輸出結果如圖4 。               
            }else{
                alert(xhr.statusText)//如果沒有獲取name.json的資料，即伺服器找不到這個檔案，則執行該段程式碼。輸出框會顯示“Not Found”。如果是alert(xhr.status)，則顯示404；
                }

            }
        }
        };


</script>
</html>

<script type="text/javascript">
    function checkname() {
        var username = document.getElementById('username').value;
        var boo = false;
        //1、建立物件
        var xhr = new XMLHttpRequest();
        //2、連線伺服器
        xhr.open('GET','name1.json',true);
        //3、向伺服器傳送請求
        xhr.send(null);
        //4、請求完成，響應就緒
        xhr.onreadystatechange=function(){
        if (xhr.readyState==4) {
            if (xhr.status==200) {
                var str = JSON.parse(xhr.responseText);//將json資料轉換成js陣列物件
                alert(str)                  
             for (var i = 0; i < str.length; i++) {
                if (username == str[i]) {
                    boo = true;
                }
             }//判斷使用者名稱是否已經存在，即輸入的使用者名稱是否存在與json檔案中。
            if (boo) {
               alert("使用者民已存在");
            } else {
                alert("使用者名稱可以使用")
            }

            }
        }
        };
     ｝；


</script>

ajax例項程式碼及效果

ps：不足之處，請大家多多指教以下html檔案都要伺服器環境下開啟。 <!DOCTYPE html> <html lang="en"> <head>

十三種基於直方圖的影象全域性二值化演算法原理、實現、程式碼及效果。

分享一下我老師大神的人工智慧教程！零基礎，通俗易懂！http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識，造福人民，實現我們中華民族偉大復興！

sqlite3例項程式碼及遇到的問題

#include <stdio.h> #include <sqlite3.h> static int callback(void *NotUsed, int argc, char **argv, char **azColName) { int

JavaScript Ajax Json實現上下級下拉框聯動效果例項程式碼

最近嘗試做出一個部門和人員的下拉框聯動功能，部門和人員的對應關係是1:N 程式碼如下: <div class="forntName">部門</div> <div class="inpBox"> <select name="d

Java RMI特性及例項程式碼

RMI （Remote Method Invocation） 1，RMI 採用stubs 和 skeletons 來進行遠端物件(remote object)的通訊。stub 充當遠端物件的客戶端代理，有著和遠端物件相同的遠端介面，遠端物件的呼叫實際是通過呼叫該物件的客戶端代理物件stub來

Qt5佈局管理例項（含程式碼及簡介）

一、例項效果（a）“基本資訊頁面” （b）"

《機器學習實戰》第2章閱讀筆記3 使用K近鄰演算法改進約會網站的配對效果—分步驟詳細講解1——資料準備：從文字檔案中解析資料（附詳細程式碼及註釋）

本篇使用的資料存放在文字檔案datingTestSet2.txt中，每個樣本資料佔據一行，總共有1000行。樣本主要包含以下3中特徵：（1）每年獲得飛行常客里程數（2）玩視訊遊戲所耗時間百分比（3）每週消費的冰淇淋公升數在使用分類器之前，需要將處理的檔案格式

Spark MLlib 貝葉斯分類演算法例項具體程式碼及執行過程詳解

import org.apache.log4j.{Level, Logger} import org.apache.spark.{SparkConf, SparkContext} import org.apache.spark.mllib.classification.{NaiveBayes, Naiv

php rabbitmq操作類及生產者和消費者例項程式碼

注意事項： 1、accept.php消費者程式碼需要在命令列執行 2、'username'=>'asdf','password'=>'123456' 改成自己的帳號和密碼 RabbitMQCommand.php操作類程式碼 <?php /* * am

roc曲線簡單介紹及例項程式碼

今日筆記：roc曲線還是僅供自己參考學習。。首先要注意的是roc曲線僅適用於二分類問題，不是二分類問題應首先通過各種手段轉為二分類問題。 roc橫座標為TPR，縱座標為TPR，若要知道TPR,FPR，就要從混淆矩陣說起... 漏掉了f1..f1 = 2*p*r

k最鄰近演算法-KNN，及python3 例項程式碼

剛讀了《machine learning in action》的KNN演算法。 K最近鄰演算法（kNN，k-NearestNeighbo），即計算到每個樣本的距離，選取前k個。從前k個選擇出大多數屬於的class來進行分類，以下特點： 1. 簡單，無需訓練 2. 樣本數量不

gson java物件與json轉換(例項程式碼說明及教程)

java物件轉json public class MsgInfo2 { private String message; private String flag; public String

資料探勘之clara演算法原理及例項(程式碼中有bug)

繼上兩篇文章介紹聚類中基於劃分思想的k-means演算法和k-mediod演算法本文將繼續介紹另外一種基於劃分思想的k-mediod演算法-----clara演算法 clara演算法可以說是對k-mediod演算法的一種改進,就如同k-mediod演算法對 k-m

Ajax 簡單的例項程式碼

AJAX = Asynchronous JavaScript and XML（非同步的 JavaScript 和 XML）。 AJAX 不是新的程式語言，而是一種使用現有標準的新方法。 AJAX 是與伺服器交換資料並更新部分網頁的藝術，在不重新載入整個頁面的情況下。

JQuery中ajax的簡單使用教程（附帶例項程式碼）

當接觸一項新技術時，首先我們要問自己四個問題，如果這四個問題我們都能學習並理解到位，那麼可以說這個新技術你已經完成了初步掌握，下面我們就這四個問題來說ajax應該怎麼學習。如果你已經看過我寫的JS中ajax的使用教程，相信你對ajax已經有了一個基礎瞭解。那麼可以直接看第四

Java 執行緒池詳解及例項程式碼

這篇文章主要介紹了Java 執行緒池的相關資料,並符例項程式碼，幫助大家學習參考，需要的朋友可以參考下執行緒池的技術背景在面向物件程式設計中，建立和銷燬物件是很費時間的，因為建立一個物件要獲取記憶體資源或者其它更多資源。在Java中更是如此，虛擬機器將試圖跟蹤每一個物件，以便

平臺表單默認按鈕的使用及效果展示—JEPLUS軟件快速開發平臺

target alt edi 打開 ML 今天 src editor www. JEPLUS平臺表單默認按鈕的使用及效果展示系統開發過程中會有許多按鈕的配置和使用，JEPLUS平臺也有許多默認的按鈕配置同時也支持自定義一些按鈕配置，今天這篇筆記就主要介紹一下

通過js和ajax獲取token及刷新token示例

ssi ole func 存在 dom 可選 nbsp scope 網頁基於Oauth2.0協議授權碼模式授權碼模式工作流程：（A）瀏覽器訪問該js客戶端，js將網頁重定向到認證服務器(/oauth/authorize)，攜帶clientid等信息（B）用戶選擇是否

Ajax 詳解及CORS

fun 字段 ref object resource 轉換用法 tlist 同源策略 Ajax 是什麽？ Ajax 即“Asynchronous Javascript And XML”（異步 JavaScript 和 XML）是指一種創建交互式網頁應用的網頁開發技術。它由

Ajax詳解及使用Ajax時的返回值類型有哪些？

itl use text 數據 .ajax ack 部分 $.ajax llb Ajax詳解 Ajax = 異步 JavaScript 和 XML。 Ajax 是一種用於創建快速動態網頁的技術。通過在後臺與服務器進行少量數據交換，A

ajax例項程式碼及效果

相關推薦