jquery ajax 簡單范例(界面+后臺)
更新時間:2013年11月19日 16:41:17 作者:
jquery ajax示例包含界面及后臺部分,經(jīng)測試效果還不錯,喜歡的朋友可以拿去用,或二次修改
界面:
<script>
$(document).ready(function () {
$("#b01").click(function () {
htmlobj = $.ajax({ url: "/Content/upFile/測試.txt", async: false });
$("#div01").html(htmlobj.responseText);
});
});
$(document).ready(function () {
$("#test").load("/Content/upFile/測試2.txt #p1", function (responseTxt, statusTxt, xhr) {
if (statusTxt == "success")
alert("外部內(nèi)容加載成功!" + xhr);
if (statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.statusText);
});
});
$(document).ready(function () {
$("#getbutton").click(function () {
$.get("/DownSet/index", function (data, status) {
alert("數(shù)據(jù):" + data + "\n狀態(tài):" + status);
});
});
});
$(document).ready(function () {
$("#postbutton").click(function () {
$.get("/CustomerInformation/getS", { par: "ww" }, function (data, status) {
alert("數(shù)據(jù):" + data + "\n狀態(tài):" + status);
$("#postText").html(data);
});
});
});
</script>
<div id="div04">
<h2 id="postText">post方法加載文本后 會在這里顯示</h2>
<input type="button" value="post方法獲取" id="postbutton" />
</div>
<div id="div03">
<h2 id="getText">get方法加載文本后 會在這里顯示</h2>
<input type="button" value="get方法獲取" id="getbutton" />
</div>
<div id="div02">
<h2>jquery load方法加載的顯示在這里</h2>
<h2 id="test">加載文本后 會在這里顯示</h2>
</div>
<div id="div01">
<h2>加載文本后 會在這里顯示</h2>
</div>
<p>
<input type="button" value="加載文本" id="b01"/>
</p>
后臺:
public string getS(string par)
{
string content = "";
if (par.Equals("ww"))
{
content = "cheng gong le";
}
else
{
content = "shi bai le";
}
return content;
}
復(fù)制代碼 代碼如下:
<script>
$(document).ready(function () {
$("#b01").click(function () {
htmlobj = $.ajax({ url: "/Content/upFile/測試.txt", async: false });
$("#div01").html(htmlobj.responseText);
});
});
$(document).ready(function () {
$("#test").load("/Content/upFile/測試2.txt #p1", function (responseTxt, statusTxt, xhr) {
if (statusTxt == "success")
alert("外部內(nèi)容加載成功!" + xhr);
if (statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.statusText);
});
});
$(document).ready(function () {
$("#getbutton").click(function () {
$.get("/DownSet/index", function (data, status) {
alert("數(shù)據(jù):" + data + "\n狀態(tài):" + status);
});
});
});
$(document).ready(function () {
$("#postbutton").click(function () {
$.get("/CustomerInformation/getS", { par: "ww" }, function (data, status) {
alert("數(shù)據(jù):" + data + "\n狀態(tài):" + status);
$("#postText").html(data);
});
});
});
</script>
<div id="div04">
<h2 id="postText">post方法加載文本后 會在這里顯示</h2>
<input type="button" value="post方法獲取" id="postbutton" />
</div>
<div id="div03">
<h2 id="getText">get方法加載文本后 會在這里顯示</h2>
<input type="button" value="get方法獲取" id="getbutton" />
</div>
<div id="div02">
<h2>jquery load方法加載的顯示在這里</h2>
<h2 id="test">加載文本后 會在這里顯示</h2>
</div>
<div id="div01">
<h2>加載文本后 會在這里顯示</h2>
</div>
<p>
<input type="button" value="加載文本" id="b01"/>
</p>
后臺:
復(fù)制代碼 代碼如下:
public string getS(string par)
{
string content = "";
if (par.Equals("ww"))
{
content = "cheng gong le";
}
else
{
content = "shi bai le";
}
return content;
}
相關(guān)文章
JQuery實(shí)現(xiàn)動態(tài)操作表格
本文主要分享了jQuery實(shí)現(xiàn)對一個表格動態(tài)的添加行,刪除行,并且對表格中內(nèi)容進(jìn)行非空驗(yàn)證的示例代碼。具有很好的參考價值,下面跟著小編一起來看下吧2017-01-01
jQuery插件FusionCharts實(shí)現(xiàn)的Marimekko圖效果示例【附demo源碼】
這篇文章主要介紹了jQuery插件FusionCharts實(shí)現(xiàn)的Marimekko圖效果,結(jié)合實(shí)例形式分析了jQuery使用FusionCharts插件結(jié)合xml數(shù)據(jù)繪制Marimekko圖的相關(guān)操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
jQuery.query.js 取參數(shù)的兩點(diǎn)問題分析
最近在項(xiàng)目中使用jQuery.query.js這個插件進(jìn)行頁面間URL傳值,遇到如下兩點(diǎn)問題2012-08-08
jQuery實(shí)現(xiàn)購物車表單自動結(jié)算效果實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)購物車表單自動結(jié)算效果,涉及jquery動態(tài)獲取頁面元素及實(shí)時改變頁面元素值的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08
jQuery實(shí)現(xiàn)為table表格動態(tài)添加或刪除tr功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)為table表格動態(tài)添加或刪除tr功能,結(jié)合實(shí)例形式分析了jQuery針對table表格行動態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-02-02
jQuery+css實(shí)現(xiàn)炫目的動態(tài)塊漂移效果
這篇文章主要介紹了jQuery+css實(shí)現(xiàn)的動態(tài)塊漂移效果,涉及jQuery基于隨機(jī)數(shù)與時間函數(shù)動態(tài)操作頁面元素樣式的相關(guān)技巧,需要的朋友可以參考下2016-01-01
jQuery實(shí)現(xiàn)的個性化返回底部與返回頂部特效代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)的個性化返回底部與返回頂部特效代碼,涉及jQuery結(jié)合動畫函數(shù)響應(yīng)鼠標(biāo)事件動態(tài)改變頁面元素樣式的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-10-10
jQuery實(shí)現(xiàn)精美的多級下拉菜單特效
這篇文章主要介紹了jQuery實(shí)現(xiàn)精美的多級下拉菜單特效,主要依托于jQuery的fg.menu.js插件來實(shí)現(xiàn)的,效果非常棒,推薦給大家。2015-03-03

