AJAX get請求如何提交數據呢?

在 AJAX 中使用 GET 請求提交數據,主要通過?在 URL 后拼接查詢參數?的方式實現,具體步驟如下:

1.構造帶參數的 URL

將數據以?鍵=值?的形式拼接在 URL 后,多個參數間用?&?連接。例如:

var url = "https://example.com/api?param1=value1&param2=value2";  

若參數值包含特殊字符(如空格、中文等),需用?encodeURIComponent()?編碼,確保 URL 合法:

var paramValue = "特殊值/空格";  
var encodedParam = encodeURIComponent(paramValue);  
var url = `https://example.com/api?param=${encodedParam}`;  

2.發起 GET 請求

使用?XMLHttpRequest?對象發起請求,將構造好的 URL 傳入?open()?方法:

var xhr = new XMLHttpRequest();  
xhr.open("GET", url, true); // 第三個參數為是否異步,一般設為 true  
xhr.send(); // GET 請求的 send() 通常無參數(數據已在 URL 中)  

示例

window.onload = function() {  document.getElementById("helloBtn").onclick = function() {  var xhr = new XMLHttpRequest();  // 拼接參數(假設獲取用戶信息,參數為用戶名和年齡)  var params = "username=John&age=30";  var url = "/ajax/ajaxrequest1?" + params;  xhr.open("GET", url, true);  xhr.onreadystatechange = function() {  if (xhr.readyState === 4 && xhr.status === 200) {  // 處理響應數據  console.log(xhr.responseText);  }  };  xhr.send();  };  
};  

注意

  • GET 請求的參數暴露在 URL 中,不適合傳輸敏感數據(如密碼)。
  • 不同瀏覽器對 URL 長度有限制(一般約 4KB),不適合傳輸大量數據。

通過這種方式,即可在 AJAX 的 GET 請求中向服務器提交數據。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/web/81505.shtml
繁體地址,請注明出處:http://hk.pswp.cn/web/81505.shtml
英文地址,請注明出處:http://en.pswp.cn/web/81505.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

基于FashionMnist數據集的自監督學習(對比式自監督學習SimCLR算法)

目錄 一,對比式自監督學習 1.1 簡介 1.2 常見算法 1.2.1 SimCLR (2020) 1.2.2 MoCo (2020) 1.2.3 BYOL (2021) 1.2.4 SimSiam (2021) 1.2.5 CLIP (2021) 1.2.6 DINO (2021) 1.2.7 SwAV (2020) 二,代碼邏輯分析 2.1 整體目標與流程 2.2 數據…

Linux:基礎指令與內涵理解(下)與權限

1.mv 作用:將文件移動、文件重命名 語法: mv (選項) 源文件/目錄 目標文件/目錄 (1)將文件/目錄移動到當前目錄的新文件/目錄(也就是重命名操作) 這里我們mv了test.txt文件到當前目錄下當前并不存在的ln.tx…

卷積神經網絡(CNN)入門學習筆記

什么是 CNN? CNN,全稱 卷積神經網絡(Convolutional Neural Network),是一種專門用來處理圖片、語音、文本等結構化數據的神經網絡。 它模仿人眼識別圖像的方式: 從局部到整體,一步步提取特征&a…

c#基礎07(調試與異常捕捉)

文章目錄 調試與異常捕捉調試異常處理C#中的異常類異常處理拋出對象 調試與異常捕捉 很多時間,寫代碼不能一擼到底,中間都是經歷過無數次的調試,才能正常正確的運行起來。.Net調試有很多方法和技巧。 調試 在C#中程序調試主要指在Visual S…

一種比較精簡的協議

鏈接地址為:ctLink: 一個比較精簡的支持C/C的嵌入式通信的中間協議。 本文采用的協議格式如下 *幀頭 uint8_t 起始字節:0XAF\ *協議版本 uint8_t 使用的協議版本號:當前為0X01\ *負載長度 uint8_t 數據段內容長…

【windwos】文本編輯器Notepad++ 替代品Notepad--

一、N和N--對比介紹 曾經備受推崇的「Notepad」曾是Windows上的經典代碼編輯器。然而,作者的一些政治言論已經讓它被廣大中國用戶拋棄。 一個名為「Notepad--」的新編輯器,也是開源免費,功能和實用性也在盡可能接近。與此同時,「N…

貪心算法套路模板+詳細適用場景+經典題目清單

1. 排序 貪心選擇 適用場景: 任務調度問題:需要安排多個任務,盡量完成更多任務或最小沖突。 區間調度問題:選出最多互不重疊的區間。 區間覆蓋問題:用最少區間覆蓋某個范圍。 合并區間問題:合并重疊區…

Qt QPaintEvent繪圖事件painter使用指南

繪制需在paintEvent函數中實現 用圖片形象理解 如果加了刷子再用筆就相當于用筆畫過的區域用刷子走 防雷達&#xff1a; 源文件 #include "widget.h" #include "ui_widget.h" #include <QDebug> #include <QPainter> Widget::Widget(QWidget…

SIGGRAPH 2025 | 快手可靈團隊提出3D感知的電影級文本到視頻生成框架CineMaster

Sora、可靈等視頻生成模型令人驚艷的性能表現使得創作者僅依靠文本輸入就能夠創作出高質量的視頻內容。然而&#xff0c;我們常見的電影片段通常是由導演在一個場景中精心布置多個目標的運動、攝像機拍攝角度后再剪輯而成的。例如&#xff0c;在拍攝賽車追逐的場景時&#xff0…

在springboot,禁止查詢數據庫種的某字段

使用Mp注解&#xff08;只對Mp提供的基礎方法有效&#xff09; 在注解TableField后面加一個select false,這樣就無法查詢到該表下密碼這個字段了 但需要注意的是如果是自己寫的sql就無法通過這一種方法實現了

Spring Boot + MyBatis-Plus實現操作日志記錄

創建數據庫表 CREATE TABLE sys_operation_log (log_id bigint NOT NULL AUTO_INCREMENT COMMENT 日志ID,operation_type varchar(20) NOT NULL COMMENT 操作類型,operation_module varchar(50) NOT NULL COMMENT 操作模塊,operation_desc varchar(200) DEFAULT NULL COMMENT …

開源多模態新標桿——BAGEL本地部署教程:7B參數撬動萬億數據

一、簡介 BAGEL &#xff0c;這是一個開源的多模態基礎模型&#xff0c;具有 70 億個激活參數&#xff08;總共 140 億個&#xff09;&#xff0c;并在大規模交錯多模態數據上進行訓練。 BAGEL 在標準多模態理解排行榜上超越了當前頂級的開源 VLMs 如 Qwen2.5-VL 和 InternVL…

SD卡+FATFS+Tinyjpeg圖片解碼顯示 (STM32F103VET6通過CubeMX快速建立工程)

先展示最終實現的功能效果如下: 1.目的與意義 為什么選用SD卡? 使用Nor-flash(W25Q系列)進行圖片的存取,需要先把圖片通過對應軟件批量處理為二進制bin文件,再通過SPI等通訊方式將 bin文件燒寫進Nor-flash才能進行使用,使用時還要記住每張圖片的首地址和對應字節數,MC…

數據結構-散列表查找(哈希表)

一&#xff0c;散列表查找定義 散列技術是在記錄的存儲位置和它的關鍵字之間建立一個確定的對應關系f&#xff0c;使得每個關鍵字key對應一個存儲位置f(key)。查找時&#xff0c;根據這個確定的對應關系找到給定值key的映射f(key)&#xff0c;若查找集中存在這個記錄&#xff0…

Stable Diffusion 簡單了解一下

1. 幫我簡單介紹一下:StableDiffusion ?? Stable Diffusion 是什么? Stable Diffusion 是一個 文本生成圖像(Text-to-Image) 的人工智能模型。你只需要輸入一句話,它就能根據這句話生成一張高質量的圖片。 比如: "一只穿著太空服的貓,在月球上彈吉他"St…

R語言科研編程-標準偏差柱狀圖

生成隨機數據 在R中&#xff0c;可以使用rnorm()生成正態分布的隨機數據&#xff0c;并模擬分組數據。以下代碼生成3組&#xff08;A、B、C&#xff09;隨機數據&#xff0c;每組包含10個樣本&#xff1a; set.seed(123) # 確保可重復性 group_A <- rnorm(10, mean50, sd…

普羅米修斯監控CPU\內存匯聚圖

要找出內存使用率大于80%的主機&#xff0c;你可以使用以下PromQL查詢。這個查詢會計算每個節點的內存使用率&#xff0c;然后篩選出使用率超過80%的節點&#xff1a; (avg by(nodename) ((node_memory_MemTotal_bytes - node_memory_MemAvailable_bytes)* on(instance) group…

飛牛fnNAS手機相冊備份及AI搜圖

目錄 一、相冊安裝應用 二、手機開啟自動備份 三、開始備份 四、照片檢索 五、AI搜圖設置 六、AI搜圖測試 七、照片傳遞 現代的手機,已經成為我們最親密的“伙伴”。自從手機拍照性能提升后,手機已經完全取代了簡單的卡片相機,而且與入門級“單反”相機發起了挑戰。在…

華為高斯數據庫(GaussDB)深度解析:國產分布式數據庫的旗艦之作

高斯數據庫介紹 一、高斯數據庫概述 GaussDB是華為自主研發的新一代分布式關系型數據庫&#xff0c;專為企業核心系統設計。它支持HTAP&#xff08;混合事務與分析處理&#xff09;&#xff0c;兼具強大的事務處理與數據分析能力&#xff0c;是國產數據庫替代的重要選擇。 產…

網頁 CSS美化2(詳解)

這是接著上一篇css基礎的第二篇&#xff1a;主要開始對頁面的布局進行學習 顯示模式&#xff1a; 塊級模式&#xff08;Block&#xff09; 特點 &#xff1a; 元素會獨占一行&#xff0c;在其前后會自動換行&#xff0c;與其他塊級元素在垂直方向上排列。 寬度默認為所在容器…