搜尋
首頁後端開發php教程php傳參方式1--ajax
php傳參方式1--ajax
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Jul 29, 2016 am 09:15 AM
gtltpostrequest

ajax即「Asynchronous Javascript And XML」（非同步JavaScript和XML），指一種創建網頁互動應用程式的網頁開發技術。

ajax = 非同步 JavaScript和XML（標準通用標記語言的子集）。

ajax 是一種用於建立快速動態網頁的技術。

透過在後台與伺服器進行少量資料交換，ajax 可以使網頁實現非同步更新。這意味著可以在不重新載入整個網頁的情況下，對網頁的某個部分進行更新。

傳統的網頁（不使用 ajax）如果需要更新內容，必須重載整個網頁頁面。非同步請求（XMLHttpRequest物件），局部刷新（本質是js dom）

ajax的用途還有填寫表單時候自動判斷使用者名稱是否重複，例如你寫到了，可以恢復你寫了一半的內容。 get用於獲取數據，有字數限制，請求提包括在url中，post無限制，用於修改伺服器的內容。

get是安全的請求，需要保證不修改資訊。

1、

ajax

一般用於當前頁面，不實現頁面跳躍 

2、ajax

端：如何異步得監聽伺服器端的狀態呢？透過onreadystatechange監聽readystate屬性

request.onreadystatechange = function() {

<span>if (request.readyState===4) {</span>

0：請求未初始化（尚未調用 

open()
    ）。
  • 1：請求已經建立，但是還沒有發送（還沒有呼叫 send()
    • ）。
  • 2：請求已發送，正在處理中（通常現在可以從回應中獲取內容頭）。
    • 3：請求在處理中；通常回應中已有部分資料可用了，但是伺服器還沒有完成回應的產生。
  • 4：回應已完成；您可以取得並使用伺服器的回應了。
  • 所以一般都是判斷等於4之後進行對應的操作。
但注意這個和request的status是不一樣的

比如readystate=4但是status=404表示響應完成但是響應的內容是沒有找到文件

所以一般做法是==200的時候返回內容，其他就顯示發聲錯誤即可。

注意在post請求中要設定url 成encode，及url解碼，否則無法正確給出結果

request.setRequestHeader("Content-type","application/x-www-form-urlencoded");

但是url解碼會有一個問題，由於進行urlencoded的時候加號會自動解碼成空格，&會被解碼成變數連接符，所以如果出現這些字元必須要進行轉碼

（在做canvas上傳圖片的url的時候遇到了這個問題）

Pic = Pic.replace(/+/g, "%2B");

Pic = Pic.replace(/&/g, "%26");

3、伺服器透過echo來傳回傳遞
ajax

的介面。

（提示：zendstudio內建的瀏覽器對於ajax

的頁面總是會顯示上一次的頁面，所以改成在外置瀏覽器裡運行

　　preference-general-web browser裡面設定。）　　preference-general-web browser裡面設定）

回傳一行簡單的，可以不用jason，jason可以更方便傳回不同鍵值的資料。 

<span> 1</span><span><span>DOCTYPE HTML</span><span>></span><span> 2</span><span><span>html</span><span>></span><span> 3</span><span><span>head</span><span>></span><span> 4</span><span><span>meta </span><span>http-equiv</span><span>="Content-Type"</span><span> content</span><span>="text/html; charset=utf-8"</span><span>></span><span> 5</span><span><span>title</span><span>></span>Demo<span></span><span>title</span><span>></span><span> 6</span><span><span>style</span><span>></span><span> 7</span><span>body, input, select, button, h1 </span><span>{</span><span> 8</span><span>    font-size</span><span>:</span><span> 28px</span><span>;</span><span> 9</span><span>    line-height</span><span>:</span><span>1.7</span><span>;</span><span>10</span><span>}</span><span>11</span><span></span><span>style</span><span>></span><span>12</span><span></span><span>head</span><span>></span><span>13</span><span>14</span><span><span>body</span><span>></span><span>15</span><span>16</span><span><span>h1</span><span>></span>员工查询<span></span><span>h1</span><span>></span><span>17</span><span>18</span><span><span>label</span><span>></span>请输入员工编号：<span></span><span>label</span><span>></span><span>19</span><span><span>input </span><span>type</span><span>="text"</span><span> id</span><span>="keyword"</span><span>/></span><span>20</span><span><span>button </span><span>id</span><span>="search"</span><span>></span>查询<span></span><span>button</span><span>></span><span>21</span><span><span>p </span><span>id</span><span>="searchResult"</span><span>></span><span>p</span><span>></span><span>22</span><span>23</span><span><span>h1</span><span>></span>员工新建<span></span><span>h1</span><span>></span><span>24</span><span><span>label</span><span>></span>请输入员工姓名：<span></span><span>label</span><span>></span><span>25</span><span><span>input </span><span>type</span><span>="text"</span><span> id</span><span>="staffName"</span><span>/><span>br</span><span>></span><span>26</span><span><span>label</span><span>></span>请输入员工编号：<span></span><span>label</span><span>></span><span>27</span><span><span>input </span><span>type</span><span>="text"</span><span> id</span><span>="staffNumber"</span><span>/><span>br</span><span>></span><span>28</span><span><span>label</span><span>></span>请选择员工性别：<span></span><span>label</span><span>></span><span>29</span><span><span>select </span><span>id</span><span>="staffSex"</span><span>></span><span>30</span><span><span>option</span><span>></span>女<span></span><span>option</span><span>></span><span>31</span><span><span>option</span><span>></span>男<span></span><span>option</span><span>></span><span>32</span><span></span><span>select</span><span>><span>br</span><span>></span><span>33</span><span><span>label</span><span>></span>请输入员工职位：<span></span><span>label</span><span>></span><span>34</span><span><span>input </span><span>type</span><span>="text"</span><span> id</span><span>="staffJob"</span><span>/><span>br</span><span>></span><span>35</span><span><span>button </span><span>id</span><span>="save"</span><span>></span>保存<span></span><span>button</span><span>></span><span>36</span><span><span>p </span><span>id</span><span>="createResult"</span><span>></span><span>p</span><span>></span><span>37</span><span>38</span><span><span>script</span><span>></span><span>39</span><span>document.getElementById(</span><span>"</span><span>search</span><span>"</span><span>).onclick </span><span>=</span><span>function</span><span>() { 
</span><span>40</span><span>var</span><span> request </span><span>=</span><span>new</span><span> XMLHttpRequest();
</span><span>41</span><span>    request.open(</span><span>"</span><span>GET</span><span>"</span><span>, </span><span>"</span><span>serverjson.php?number=</span><span>"</span><span>+</span><span> document.getElementById(</span><span>"</span><span>keyword</span><span>"</span><span>).value);
</span><span>42</span><span>    request.send();
</span><span>43</span><span>    request.onreadystatechange </span><span>=</span><span>function</span><span>() {
</span><span>44</span><span>if</span><span> (request.readyState</span><span>===</span><span>4</span><span>) {
</span><span>45</span><span>if</span><span> (request.status</span><span>===</span><span>200</span><span>) { </span><span>//</span><span>不同的status在<strong>百度</strong>可以找到</span><span>46</span><span>var</span><span> data </span><span>=</span><span> JSON.parse(request.responseText);</span><span>//</span><span>json.parse!</span><span>47</span><span>if</span><span> (data.success) { </span><span>//</span><span>注意seccess也返回jason的一个键值</span><span>48</span><span>                    document.getElementById(</span><span>"</span><span>searchResult</span><span>"</span><span>).innerHTML </span><span>=</span><span> data.msg;</span><span>//</span><span>json中的msg键值</span><span>49</span><span>                } </span><span>else</span><span> {
</span><span>50</span><span>                    document.getElementById(</span><span>"</span><span>searchResult</span><span>"</span><span>).innerHTML </span><span>=</span><span>"</span><span>出现错误：</span><span>"</span><span>+</span><span> data.msg;
</span><span>51</span><span>                }
</span><span>52</span><span>            } </span><span>else</span><span> {<br></span><span>53</span><span>                alert(</span><span>"</span><span>发生错误：</span><span>"</span><span>+</span><span> request.status);
</span><span>54</span><span>            }
</span><span>55</span><span>        } 
</span><span>56</span><span>    }
</span><span>57</span><span>}
</span><span>58</span><span>59</span><span>document.getElementById(</span><span>"</span><span>save</span><span>"</span><span>).onclick </span><span>=</span><span>function</span><span>() { 
</span><span>60</span><span>var</span><span> request </span><span>=</span><span>new</span><span> XMLHttpRequest();
</span><span>61</span><span>    request.open(</span><span>"</span><span>POST</span><span>"</span><span>, </span><span>"</span><span>serverjson.php</span><span>"</span><span>);
</span><span>62</span><span>var</span><span> data </span><span>=</span><span>"</span><span>name=</span><span>"</span><span>+</span><span> document.getElementById(</span><span>"</span><span>staffName</span><span>"</span><span>).value 
</span><span>63</span><span>+</span><span>"</span><span>&number=</span><span>"</span><span>+</span><span> document.getElementById(</span><span>"</span><span>staffNumber</span><span>"</span><span>).value 
</span><span>64</span><span>+</span><span>"</span><span>&sex=</span><span>"</span><span>+</span><span> document.getElementById(</span><span>"</span><span>staffSex</span><span>"</span><span>).value 
</span><span>65</span><span>+</span><span>"</span><span>&job=</span><span>"</span><span>+</span><span> document.getElementById(</span><span>"</span><span>staffJob</span><span>"</span><span>).value;
</span><span>66</span><span>    request.setRequestHeader(</span><span>"</span><span>Content-type</span><span>"</span><span>,</span><span>"</span><span>application/x-www-form-urlencoded</span><span>"</span><span>);
</span><span>67</span><span>    request.send(data);
</span><span>68</span><span>    request.onreadystatechange </span><span>=</span><span>function</span><span>() {
</span><span>69</span><span>if</span><span> (request.readyState</span><span>===</span><span>4</span><span>) {
</span><span>70</span><span>if</span><span> (request.status</span><span>===</span><span>200</span><span>) { 
</span><span>71</span><span>var</span><span> data </span><span>=</span><span> JSON.parse(request.responseText);
</span><span>72</span><span>if</span><span> (data.success) { 
</span><span>73</span><span>                    document.getElementById(</span><span>"</span><span>createResult</span><span>"</span><span>).innerHTML </span><span>=</span><span> data.msg;
</span><span>74</span><span>                } </span><span>else</span><span> {
</span><span>75</span><span>                    document.getElementById(</span><span>"</span><span>createResult</span><span>"</span><span>).innerHTML </span><span>=</span><span>"</span><span>出现错误：</span><span>"</span><span>+</span><span> data.msg;
</span><span>76</span><span>                }
</span><span>77</span><span>            } </span><span>else</span><span> {
</span><span>78</span><span>                alert(</span><span>"</span><span>发生错误：</span><span>"</span><span>+</span><span> request.status);
</span><span>79</span><span>            }
</span><span>80</span><span>        } 
</span><span>81</span><span>    }
</span><span>82</span><span>}
</span><span>83</span><span></span><span>script</span><span>></span><span>84</span><span></span><span>body</span><span>></span><span>85</span><span></span><span>html</span><span>></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span>

 3、

回應serverjason.php

<span>php
</span><span>//</span><span>设置页面内容是html编码格式是utf-8</span><span>header</span>("Content-Type: text/plain;charset=utf-8"<span>); 
</span><span>//</span><span>header("Content-Type: application/json;charset=utf-8"); 
//header("Content-Type: text/xml;charset=utf-8"); 
//header("Content-Type: text/html;charset=utf-8"); 
//header("Content-Type: application/javascript;charset=utf-8"); 

//定义一个多维数组，包含员工的信息，每条员工信息为一个数组</span><span>$staff</span> = <span>array</span><span>    (
        </span><span>array</span>("name" => "洪七", "number" => "101", "sex" => "男", "job" => "总经理"),
        <span>array</span>("name" => "郭靖", "number" => "102", "sex" => "男", "job" => "开发工程师"),
        <span>array</span>("name" => "黄蓉", "number" => "103", "sex" => "女", "job" => "产品经理"<span>)
    );

</span><span>//</span><span>判断如果是get请求，则进行搜索；如果是POST请求，则进行新建
//$_SERVER是一个超<strong>全局变量</strong>，在一个脚本的全部作用域中都可用，不用使用global关键字
//$_SERVER["REQUEST_METHOD"]返回访问页面使用的请求方法</span><span>if</span> (<span>$_SERVER</span>["REQUEST_METHOD"] == "GET"<span>) {
    search();
} </span><span>elseif</span> (<span>$_SERVER</span>["REQUEST_METHOD"] == "POST"<span>){
    create();
}

</span><span>//</span><span>通过员工编号搜索员工</span><span>function</span><span> search(){
    </span><span>//</span><span>检查是否有员工编号的参数
    //isset检测变量是否设置；empty判断值为否为空
    //超<strong>全局变量</strong> $_GET 和 $_POST 用于收集表单数据</span><span>if</span> (!<span>isset</span>(<span>$_GET</span>["number"]) || <span>empty</span>(<span>$_GET</span>["number"<span>])) {
        </span><span>echo</span> '{"success":false,"msg":"参数错误"}';<span>//</span><span>jason格式</span><span>return</span><span>;
    }
    </span><span>//</span><span>函数之外声明的变量拥有 Global 作用域，只能在函数以外进行访问。
    //global 关键词用于访问函数内的<strong>全局变量</strong></span><span>global</span><span>$staff</span><span>;
    </span><span>//</span><span>获取number参数</span><span>$number</span> = <span>$_GET</span>["number"<span>];
    </span><span>$result</span> = '{"success":false,"msg":"没有找到员工。"}'<span>;
    
    </span><span>//</span><span>遍历$staff多维数组，查找key值为number的员工是否存在，如果存在，则修改返回结果</span><span>foreach</span> (<span>$staff</span><span>as</span><span>$value</span><span>) {
        </span><span>if</span> (<span>$value</span>["number"] == <span>$number</span><span>) {
            </span><span>$result</span> = '{"success":true,"msg":"找到员工：员工编号：' . <span>$value</span>["number"] . 
                            '，员工姓名：' . <span>$value</span>["name"] . 
                            '，员工性别：' . <span>$value</span>["sex"] . 
                            '，员工职位：' . <span>$value</span>["job"] . '"}';<span>//</span><span>jason格式</span><span>break</span><span>;
        }
    }
    </span><span>echo</span><span>$result</span><span>;
}

</span><span>//</span><span>创建员工</span><span>function</span><span> create(){
    </span><span>//</span><span>判断信息是否填写完全</span><span>if</span> (!<span>isset</span>(<span>$_POST</span>["name"]) || <span>empty</span>(<span>$_POST</span>["name"<span>])
        </span>|| !<span>isset</span>(<span>$_POST</span>["number"]) || <span>empty</span>(<span>$_POST</span>["number"<span>])
        </span>|| !<span>isset</span>(<span>$_POST</span>["sex"]) || <span>empty</span>(<span>$_POST</span>["sex"<span>])
        </span>|| !<span>isset</span>(<span>$_POST</span>["job"]) || <span>empty</span>(<span>$_POST</span>["job"<span>])) {
        </span><span>echo</span> '{"success":false,"msg":"参数错误，员工信息填写不全"}'<span>;
        </span><span>return</span><span>;
    }
    </span><span>//</span><span>TODO: 获取POST表单数据并保存到数据库
    
    //提示保存成功</span><span>echo</span> '{"success":true,"msg":"员工：' . <span>$_POST</span>["name"] . ' 信息保存成功！"}'<span>;
}

</span>?>

4、下面是jj

以上就介紹了php傳參方式1--ajax，包含了方面的內容，希望對PHP教學有興趣的朋友有幫助。

陳述
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
相關文章
华为GT3 Pro和GT4的差异是什么？华为GT3 Pro和GT4的差异是什么？Dec 29, 2023 pm 02:27 PM

许多用户在选择智能手表的时候都会选择的华为的品牌，其中华为GT3pro和GT4都是非常热门的选择，不少用户都很好奇华为GT3pro和GT4有什么区别，下面就就给大家介绍一下二者。华为GT3pro和GT4有什么区别一、外观GT4：46mm和41mm，材质是玻璃表镜+不锈钢机身+高分纤维后壳。GT3pro：46.6mm和42.9mm，材质是蓝宝石玻璃表镜+钛金属机身/陶瓷机身+陶瓷后壳二、健康GT4：采用最新的华为Truseen5.5+算法，结果会更加的精准。GT3pro：多了ECG心电图和血管及安

修复：截图工具在 Windows 11 中不起作用修复：截图工具在 Windows 11 中不起作用Aug 24, 2023 am 09:48 AM

为什么截图工具在Windows11上不起作用了解问题的根本原因有助于找到正确的解决方案。以下是截图工具可能无法正常工作的主要原因：对焦助手已打开：这可以防止截图工具打开。应用程序损坏：如果截图工具在启动时崩溃，则可能已损坏。过时的图形驱动程序：不兼容的驱动程序可能会干扰截图工具。来自其他应用程序的干扰：其他正在运行的应用程序可能与截图工具冲突。证书已过期：升级过程中的错误可能会导致此issu简单的解决方案这些适合大多数用户，不需要任何特殊的技术知识。1.更新窗口和Microsoft应用商店应用程

php request什么意思php request什么意思Jul 07, 2021 pm 01:49 PM

request的中文意思为“请求”，是php中的一个全局变量，是一个包含了“$_POST”、“$_GET”和“$_COOKIE”的数组。“$_REQUEST”变量可以获取POST或GET方式提交的数据、COOKIE信息。

浅析php中POST方法带参数跳转页面浅析php中POST方法带参数跳转页面Mar 23, 2023 am 09:15 AM

对于PHP开发者来说，使用POST带参数跳转页面是一项基本技能。POST是HTTP中一种发送数据的方法，它可以通过HTTP请求向服务器提交数据，跳转页面则是在服务器端进行页面的处理和跳转。在实际开发中，我们经常需要使用POST带参数来跳转页面，以达到一定的功能目的。

php怎么判断post有没有提交php怎么判断post有没有提交Mar 21, 2023 pm 07:12 PM

PHP是一种广泛使用的服务器端脚本语言，它可以用于创建交互式和动态的Web应用程序。在开发PHP应用时，我们通常需要通过表单将用户输入数据提交给服务器端处理。然而，有时候我们需要在PHP中判断是否有表单数据被提交，这篇文章将介绍如何进行这样的判断。

python requests post如何使用python requests post如何使用Apr 29, 2023 pm 04:52 PM

python模拟浏览器发送post请求importrequests格式request.postrequest.post(url,data,json,kwargs)#post请求格式request.get(url,params,kwargs)#对比get请求发送post请求传参分为表单（x-www-form-urlencoded）json（application/json）data参数支持字典格式和字符串格式，字典格式用json.dumps()方法把data转换为合法的json格式字符串次方法需要

Python 3.x 中如何使用urllib.request.urlopen()函数发送GET请求Python 3.x 中如何使用urllib.request.urlopen()函数发送GET请求Jul 30, 2023 am 11:28 AM

Python3.x中如何使用urllib.request.urlopen()函数发送GET请求在网络编程中，我们经常需要通过发送HTTP请求来获取远程服务器的数据。在Python中，我们可以使用urllib模块中的urllib.request.urlopen()函数来发送HTTP请求，并获取服务器返回的响应。本文将介绍如何使用

如何修复无法连接到iPhone上的App Store错误如何修复无法连接到iPhone上的App Store错误Jul 29, 2023 am 08:22 AM

第1部分：初始故障排除步骤检查苹果的系统状态：在深入研究复杂的解决方案之前，让我们从基础知识开始。问题可能不在于您的设备;苹果的服务器可能会关闭。访问Apple的系统状态页面，查看AppStore是否正常工作。如果有问题，您所能做的就是等待Apple修复它。检查您的互联网连接：确保您拥有稳定的互联网连接，因为“无法连接到AppStore”问题有时可归因于连接不良。尝试在Wi-Fi和移动数据之间切换或重置网络设置（“常规”>“重置”>“重置网络设置”>设置）。更新您的iOS版本：

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序，用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

顯示更多

熱門文章

R.E.P.O.能量晶體解釋及其做什麼（黃色晶體）
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前By尊渡假赌尊渡假赌尊渡假赌
刺客信條陰影：貝殼謎語解決方案
1 週前ByDDD
R.E.P.O.如果您聽不到任何人，如何修復音頻
3 週前By尊渡假赌尊渡假赌尊渡假赌
在哪裡可以找到原子中的起重機控制鑰匙卡
1 週前ByDDD
顯示更多

熱工具

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

MantisBT

MantisBT

Mantis是一個易於部署的基於Web的缺陷追蹤工具，用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序，非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具，幫助Web開發人員更好地理解保護網路應用程式的過程，並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞，難度各不相同。請注意，該軟體中

顯示更多

熱門話題

gmail信箱登陸入口在哪裡
7444
15
CakePHP 教程
1371
52
steam的賬戶名稱是什麼格式
76
11
win11激活密鑰永久
38
19
NYT連接提示和答案
9
6
顯示更多