濮阳杆衣贸易有限公司

主頁 > 知識庫 > 使用Ajax局部更新Razor頁面的實(shí)例代碼

使用Ajax局部更新Razor頁面的實(shí)例代碼

熱門標(biāo)簽:地圖標(biāo)注與公司業(yè)務(wù)關(guān)系 荊州智能電銷機(jī)器人 福建微碼電話機(jī)器人 外呼系統(tǒng)api對接 提高電話機(jī)器人接通率 銷售電銷機(jī)器人詐騙 廣西智能外呼系統(tǒng)多少錢 平?jīng)龈叩碌貓D標(biāo)注商戶要收費(fèi)嗎 大學(xué)校門地圖標(biāo)注

Razor功能非常強(qiáng)大,但是本身并不能做到無刷新,所以需要配合ajax使用

本文就做一個(gè)簡單例子,實(shí)現(xiàn)Razor配合ajax做到局部刷新。

首先,我們創(chuàng)建一個(gè)MVC項(xiàng)目

讓我們創(chuàng)建一個(gè)簡單的Controller Book

然后對其添加一個(gè)視圖,并且添加上一些簡單的Html代碼

@{
 ViewBag.Title = "Index";
 Layout = null;
}
!DOCTYPE html>
html>
head>
 meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 meta charset="utf-8" />
 meta name="viewport" content="width=device-width, initial-scale=1.0">
/head>
body>
 h2>Index/h2>
 @Html.ActionLink("點(diǎn)擊我", "Part","Book");
 div id="partial" >/div>
 @Scripts.Render("~/bundles/jquery")
 script type="text/javascript">
  $("a").click(function () {
   $.ajax({
    url: "/Test/Book/Part/1",
    success: function (result) {
     console.log(result);
     $("#partial").html(result);
    },
    error: function (msg) {
     console.log(msg);
    }
   })
   return false;
  });
  
 /script>
/body>
/html>

這里我添加了一個(gè)div>,并且給了個(gè)id="partial",再我點(diǎn)擊@Html.ActionLink時(shí)會觸發(fā)javascript里的方法,使用ajax去訪問/Test/Book/Part/1這個(gè)路徑,請求成功以后會在div>里構(gòu)建我請求的Html,這其實(shí)就是局部刷新的原理

這是Part的代碼,然后我們給Part也添加一個(gè)視圖

Part的代碼可以非常簡單,然后我們開啟我們的項(xiàng)目

我們不斷點(diǎn)擊 按鈕“點(diǎn)擊我”

頁面就會不停的發(fā)生變化。

這里需要注意,在使用AJAX請求時(shí),Url一定要寫完整,比如我的Controller在Area下的Book文件夾下名為Test,Action為Part,那么Url則是 /Test/Book/Part,不能缺少/Test,否則就會出現(xiàn)以下錯誤

可以看到,如果Url沒有寫全的話,Action返回的View其實(shí)是錯誤的路徑。

總結(jié)

以上所述是小編給大家介紹的使用Ajax局部更新Razor頁面的實(shí)例代碼,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!

您可能感興趣的文章:
  • SSH框架網(wǎng)上商城項(xiàng)目第28戰(zhàn)之使用Ajax技術(shù)局部更新商品數(shù)量和總價(jià)
  • Ajax局部更新導(dǎo)致JS事件重復(fù)觸發(fā)問題的解決方法
  • jquery ajax 局部無刷新更新數(shù)據(jù)的實(shí)現(xiàn)案例
  • Ajax異步無刷新對局部數(shù)據(jù)更新

標(biāo)簽:黔東 邯鄲 衡陽 婁底 德陽 樂山 海南 內(nèi)江

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《使用Ajax局部更新Razor頁面的實(shí)例代碼》,本文關(guān)鍵詞  使用,Ajax,局部,更新,Razor,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《使用Ajax局部更新Razor頁面的實(shí)例代碼》相關(guān)的同類信息!
  • 本頁收集關(guān)于使用Ajax局部更新Razor頁面的實(shí)例代碼的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章
    肥东县| 葵青区| 静乐县| 呈贡县| 康定县| 托里县| 嘉义县| 沧源| 岳池县| 兰溪市| 崇信县| 定州市| 唐河县| 宣威市| 酒泉市| 新民市| 台安县| 定远县| 乌兰浩特市| 尖扎县| 东兰县| 中西区| 宜君县| 密云县| 额济纳旗| 锡林郭勒盟| 无锡市| 成都市| 乐陵市| 阳新县| 安丘市| 盘锦市| 沅陵县| 米林县| 康定县| 辛集市| 邵武市| 达州市| 井陉县| 高雄县| 腾冲县|