ASP.NET利用AjaxPro完成前端跟后臺交互的方法

發(fā)布時間：2020-09-14 10:14:13 來源：億速云閱讀：144 作者：小新欄目：編程語言

這篇文章主要介紹了ASP.NET利用AjaxPro完成前端跟后臺交互的方法，具有一定借鑒價值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

引言

一.首先，還是那句話，欲練神功，必先自宮。我們開發(fā)程序第一步首先是搭建環(huán)境。

ASP.NET利用AjaxPro完成前端跟后臺交互的方法

　　啟動Visual Studio ，我的版本是2012啊，不過這個不影響的。先創(chuàng)建一個網(wǎng)站項目，在項目中加入 Bin 目錄，再添加一個 Index 頁面。

　　然后，我們需要去網(wǎng)上下載 AjaxPro.2.dll 百度一下就一堆鏈接，這里我就不多說什么了。然后把下載到的 AjaxPro.2.dll 的文件復(fù)制或引入到 Bin 目錄中。接著，在 Web.config 的 <system.web> 標(biāo)簽下寫入以下內(nèi)容。

ASP.NET利用AjaxPro完成前端跟后臺交互的方法

<httpHandlers>
  <add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/>
</httpHandlers>

　　并且在服務(wù)器后臺類中，作以下修改：

using AjaxPro;
//（1）

AjaxPro.Utility.RegisterTypeForAjax(typeof(Index));
//（2）

[AjaxPro.AjaxMethod]
//（3）

（1）：引入 AjaxPro 命名空間

（2）：注冊類信息到前臺頁面

（3）：每個前臺頁面需要調(diào)用的函數(shù)前面加上這個

ASP.NET利用AjaxPro完成前端跟后臺交互的方法

　　這里我這有個實例，注意一點：在 Page_Load() 函數(shù)當(dāng)中，使用了一個判斷。 if(Page.IsCallback) 它的作用是它獲得一個值，表示頁面請求是否是回調(diào)的結(jié)果。它的一個特殊的回傳，所以往返總是發(fā)生;但是，與傳統(tǒng)的回發(fā)不同，腳本回調(diào)不會重繪整個頁面。這是在別的博主那里爬來的，這是原文，也是個人的一個小編程習(xí)慣，我也不知道具體有什么用，但是我就是知道有用。

　　以上，咱們就把這個 AjaxPro.2 環(huán)境搭建完了。

二. 接著，就開始調(diào)用了。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx.cs" Inherits="Index" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <title>AjaxPro.2.dll</title>
  <script>
    
    function show() {
      //（1）   　　
      var name = Index.getName().value;
      alert("My Name is :" + name);

    }

  </script>
</head>
<body>
  <form id="form1" runat="server">
  <p>
    <input type="button" value="show" onclick="show()" />
  </p>
  </form>
</body>
</html>

　　這里， Index 是這個類的類名，不知道還記不記得。咱們寫過這樣一段代碼 AjaxPro.Utility.RegisterTypeForAjax(typeof(Index)); 在配置環(huán)境的時候申明的類名。前端頁面也是通過這個找到我們的類的。.value 也是一個重點，我記的我第一次用這個插件的時候。返回一個 Password 判斷是否登陸成功，一直都是失敗，這個插件頁面用日志信息，我就只能一個一個 alert 終于讓我抓著了，如果這里不用 value 會獲取很多實際應(yīng)用用不上的信息，這里需要注意。

1）以為這樣就可以調(diào)用成功了？太天真了，這里咱們說第一個細(xì)節(jié)：改變項目的托管管道模式

鼠標(biāo)單擊選中這個項目，然后按 F4 鍵，會出現(xiàn)這個項目的屬性。將這個屬性改成傳統(tǒng)型，就行了。如果是集成，則會報 500.23

ASP.NET利用AjaxPro完成前端跟后臺交互的方法

2）還有一點，也是一個錯誤。這種錯誤編譯時不會出錯，加載頁面時也不出錯。只有調(diào)用到 AjaxPro.2 的是時候才報錯Uncaught ReferenceError: Index is not defined 當(dāng)調(diào)用后臺代碼的不起作用時就需要注意是否是這個問題，因為這個報錯它不會出現(xiàn)在頁面，也不會被編譯。想要看到這個錯誤，必須按 F12 頁面調(diào)試，我知道Google Chrome 瀏覽器的錯誤顯示在 Console 選項卡當(dāng)中，其他瀏覽器博主就不是特別清楚了。

ASP.NET利用AjaxPro完成前端跟后臺交互的方法

　　這個錯誤的原因啊，博主也查了許多資料，但是很少有具體的描述。這里博主也只能做一個博主自己的總結(jié)，如果有人知道哪里有錯誤，希望各位能積極指正（別客氣，互相進(jìn)步?。。。２┲鞯姆治瞿?，就是因為搭建環(huán)境時，又什么地方出了問題。搭建環(huán)境博主剛剛也在前文中講的比較清楚了，如果出現(xiàn)這個錯誤，應(yīng)該有 7 成是這個原因。

3）這也是一個博主告訴我的細(xì)節(jié)??！他這么說的：調(diào)用的時候，不一定要用聲明的那個類名喔?？梢允褂?[AjaxNamespace("DEMO")] 這個標(biāo)簽，對這個類進(jìn)行重命名。博主試了一下，確實是可以的。把這個標(biāo)簽放在被調(diào)用的類前面，記得是類前面哦。就可以了。

ASP.NET利用AjaxPro完成前端跟后臺交互的方法

　　可以看到，效果是實現(xiàn)了的！這個標(biāo)簽還是非常實用的。

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享ASP.NET利用AjaxPro完成前端跟后臺交互的方法內(nèi)容對大家有幫助，同時也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，遇到問題就找億速云，詳細(xì)的解決方法等著你來學(xué)習(xí)!

向AI問一下細(xì)節(jié)

ASP.NET利用AjaxPro完成前端跟后臺交互的方法

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽