相思资源网 Design By www.200059.com
还是先说一些基础知识：
语法：$.ajax({option})
option表示参数。以key/value形式出现。
常用参数：type:post/get。
url:发送请求的地址。
data:{object:object} 发送到服务器的数据，必须为key/value格式。可以设置processData属性，不转换数据格式。
success:function(msg){} 请求成功后回调函数。
error:function(msg){} 请求失败后回调函数。
dataType:xml/html/script/json/jsonp 返回的数据类型。
再看实例理解：
1.用Ajax实现无刷新审核功能（点击审核后，LinkButton不可用，并改为已审核）。
界面如下：
这里数据显示用的是Repeater控件，其中审核按钮为LinkButton服务器控件。
页面Html代码：
复制代码 代码如下:
<body>
<form id="form1" runat="server">
<div>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="Main_List_Table"
rules="none">
<tr class="Main_List_Table_Tr1">
<td width="5%">
选择
</td>
<td width="18%">
单号
</td>
<td width="15%">
状态
</td>
<td width="18%">
店铺
</td>
<td width="18%">
购买者
</td>
<td width="13%">
RMB
</td>
<td>
操作
</td>
</tr>
<asp:Repeater ID="rpt_Review" runat="server">
<ItemTemplate>
<tr onmouseover="this.className='Main_List_Table_Tr_Over'" onmouseout="this.className='Main_List_Table_Tr_Out'">
<td>
<input type="checkbox" id="OrderId_<%#Eval("OrderId") %>" name="OrderId" value="<%#Eval("OrderId") %>" />
</td>
<td>
<%#Eval("OrderId") %></a>
</td>
<td>
<%# Eval("oState").ToString() %>
</td>
<td>
1号店铺
</td>
<td>
张三
</td>
<td>
100.00
</td>
<td>
<asp:LinkButton ID="lbtn_Audit_eShop_Price" runat="server">审核</asp:LinkButton>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
</div>
<div class="padding_Top10">
<label for="sel_All" style="cursor: pointer">
<input type="checkbox" name="sel_All" id="sel_All" onclick="selectAll('sel_All', 'OrderId');" />全选/反选</label>
<input type="button" id="btn_Batch_Review" onclick="return Batch_Review();" value="批量审核" />
</div>
</form>
</body>
实现代码如下：
a.脚本代码：
复制代码 代码如下:
function lbtn_Audit_eShop_Price_Command(obj,orderId)
{
if (obj.innerHTML != "审核") return false;
if (!confirm("确定要审核吗？")) {
return false;
}
$.ajax({
type:"post",//Post发送方式
url:"AjaxTest.aspx",//请求地址为本页面地址
data:{OrderId:orderId,Action:"Single_Review"},//传入数据为订单号以及Action
success:(function(msg){
if(msg!="")
{
var chkId = "OrderId_"+orderId;
document.getElementById(chkId).disabled = "disabled";
obj.disabled = "disabled";
obj.innerHTML = "已审核";
}
})
});
return false;
}
b.服务器代码：
根据Action判断事件的执行。
复制代码 代码如下:
protected void Page_Load(object sender, EventArgs e)
{
Conn.Open();
//执行动作
string Action = CommFun.Get_Safe_Str(Request["Action"]);
if (!IsPostBack)
{
if (Action == "")
{
rpt_Pro_Order_List_Bind();
}
else if (Action == "Single_Review") //点击审核
{
lbtn_Audit_eShop_Price_Command();
}
else //点击批量审核
{
btn_Batch_Review_eShop_Price();
}
}
}
Repeater绑定数据后,为LinkButton添加onclick属性,用于执行页面脚本代码。
复制代码 代码如下:
protected void rpt_Pro_Order_List_Bind()
{
……
this.rpt_Review.DataSource = Dt;
this.rpt_Review.DataBind();
for (int i = 0; i < this.rpt_Review.Items.Count; i++)
{
LinkButton lbtn_Audit_eShop_Price = (LinkButton)this.rpt_Review.Items[i].FindControl("lbtn_Audit_eShop_Price");
if (Dt.Rows[i]["Audit_eShop_Price"].ToString() == "1")
{
lbtn_Audit_eShop_Price.Enabled = false;
lbtn_Audit_eShop_Price.Text = "已审核";
}
else
{
lbtn_Audit_eShop_Price.Enabled = true;
lbtn_Audit_eShop_Price.Attributes.Add("onclick",
"return lbtn_Audit_eShop_Price_Command(this, '" + Dt.Rows[i]["OrderId"].ToString() + "');");
}
}
}
[code]
2.用Ajax实现无刷新批量审核。
注意：这里用到的控件必须是Html控件，否则会引起回发。但在Repeater内部服务器控件也可以使用。
这里只需给input="btton"添加一个onclick属性，直接执行Ajax脚本。
脚本内容如下：
[code]
//批量审核
function Batch_Review()
{
if(!checkSelItem("OrderId","请选择订单！")) return false;
if(!confirm("确定要审核吗？")) return false;
var OrderIds = ""; //记录所有订单号
var elements = document.getElementsByName("OrderId");
for (var m=0; m < elements.length; m++){
if(m == elements.length - 1)
{
OrderIds = OrderIds + elements[m].value;
}
else
{
OrderIds = OrderIds + elements[m].value + ",";
}
}
var orderIdArr = OrderIds.split(',');
var newOrderIdStr = "";
var j = 0;//记录选择的订单个数
var position = "";//记录选择的订单位置
for(var i = 0;i<orderIdArr.length;i++)
{
var chk_Id = "OrderId_"+orderIdArr[i];
if($_Id(chk_Id).checked)//记录选中的订单
{
if(i == orderIdArr.length - 1)
{
newOrderIdStr += orderIdArr[i];
position += i;
}
else
{
newOrderIdStr += orderIdArr[i]+",";
position += i + ",";
}
j++;
}
}
newOrderIdStr = RemoveRightComma(newOrderIdStr);//去除末尾逗号后的订单号
position = RemoveRightComma(position);//去除末尾逗号后的位置
$.ajax({
type: "POST",
url: "AjaxTest.aspx",
data: { Order_Id_Arr: newOrderIdStr, Action: "Batch_Review" },
success: function(msg) {
if (msg != "") {
for(var k = 0 ;k<j;k++)
{
var newOrderIdArr = newOrderIdStr.split(',');
var positionArr = position.split(',');
$_Id("OrderId_"+newOrderIdArr[k]).disabled = "disabled";
if(parseInt(positionArr[k])<10)
{
$_Id("rpt_Review_ctl0"+parseInt(positionArr[k])+"_lbtn_Audit_eShop_Price").innerHTML = "已审核";
$_Id("rpt_Review_ctl0"+parseInt(positionArr[k])+"_lbtn_Audit_eShop_Price").disabled = "disabled";
}
else
{
$_Id("rpt_Review_ctl"+parseInt(positionArr[k])+"_lbtn_Audit_eShop_Price").innerHTML = "已审核";
$_Id("rpt_Review_ctl"+parseInt(positionArr[k])+"_lbtn_Audit_eShop_Price").disabled = "disabled";
}
}
}
}
})
return true;
}
//去除右边逗号
function RemoveRightComma(str)
{
if(str == "") return;
var i;
for(i = str.length-1;i>=0;i--)
{
//charAt(i)取某一个位置的字符
if(str.charAt(i) != ",") break;
}
//截取字符串，substring(start,stop);返回的结果不包含最后一位
str = str.substring(0,i+1);
return str;
}
至此实例讲解结束。
最后回顾思路：
1.单条审核：在页面初始化时，给审核按钮加上onclick属性，执行页面脚本，单击审核后，后台的page_load事件根据Action选择执行的事件。
2.批量审核: 给批量审核按钮加上onclick属性，执行Ajax脚本，后台的page_load事件同样根据Action选择执行的事件。批量审核按钮必须为Html控件。
语法：$.ajax({option})
option表示参数。以key/value形式出现。
常用参数：type:post/get。
url:发送请求的地址。
data:{object:object} 发送到服务器的数据，必须为key/value格式。可以设置processData属性，不转换数据格式。
success:function(msg){} 请求成功后回调函数。
error:function(msg){} 请求失败后回调函数。
dataType:xml/html/script/json/jsonp 返回的数据类型。
再看实例理解：
1.用Ajax实现无刷新审核功能（点击审核后，LinkButton不可用，并改为已审核）。
界面如下：
这里数据显示用的是Repeater控件，其中审核按钮为LinkButton服务器控件。
页面Html代码：
复制代码 代码如下:
<body>
<form id="form1" runat="server">
<div>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="Main_List_Table"
rules="none">
<tr class="Main_List_Table_Tr1">
<td width="5%">
选择
</td>
<td width="18%">
单号
</td>
<td width="15%">
状态
</td>
<td width="18%">
店铺
</td>
<td width="18%">
购买者
</td>
<td width="13%">
RMB
</td>
<td>
操作
</td>
</tr>
<asp:Repeater ID="rpt_Review" runat="server">
<ItemTemplate>
<tr onmouseover="this.className='Main_List_Table_Tr_Over'" onmouseout="this.className='Main_List_Table_Tr_Out'">
<td>
<input type="checkbox" id="OrderId_<%#Eval("OrderId") %>" name="OrderId" value="<%#Eval("OrderId") %>" />
</td>
<td>
<%#Eval("OrderId") %></a>
</td>
<td>
<%# Eval("oState").ToString() %>
</td>
<td>
1号店铺
</td>
<td>
张三
</td>
<td>
100.00
</td>
<td>
<asp:LinkButton ID="lbtn_Audit_eShop_Price" runat="server">审核</asp:LinkButton>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
</div>
<div class="padding_Top10">
<label for="sel_All" style="cursor: pointer">
<input type="checkbox" name="sel_All" id="sel_All" onclick="selectAll('sel_All', 'OrderId');" />全选/反选</label>
<input type="button" id="btn_Batch_Review" onclick="return Batch_Review();" value="批量审核" />
</div>
</form>
</body>
实现代码如下：
a.脚本代码：
复制代码 代码如下:
function lbtn_Audit_eShop_Price_Command(obj,orderId)
{
if (obj.innerHTML != "审核") return false;
if (!confirm("确定要审核吗？")) {
return false;
}
$.ajax({
type:"post",//Post发送方式
url:"AjaxTest.aspx",//请求地址为本页面地址
data:{OrderId:orderId,Action:"Single_Review"},//传入数据为订单号以及Action
success:(function(msg){
if(msg!="")
{
var chkId = "OrderId_"+orderId;
document.getElementById(chkId).disabled = "disabled";
obj.disabled = "disabled";
obj.innerHTML = "已审核";
}
})
});
return false;
}
b.服务器代码：
根据Action判断事件的执行。
复制代码 代码如下:
protected void Page_Load(object sender, EventArgs e)
{
Conn.Open();
//执行动作
string Action = CommFun.Get_Safe_Str(Request["Action"]);
if (!IsPostBack)
{
if (Action == "")
{
rpt_Pro_Order_List_Bind();
}
else if (Action == "Single_Review") //点击审核
{
lbtn_Audit_eShop_Price_Command();
}
else //点击批量审核
{
btn_Batch_Review_eShop_Price();
}
}
}
Repeater绑定数据后,为LinkButton添加onclick属性,用于执行页面脚本代码。
复制代码 代码如下:
protected void rpt_Pro_Order_List_Bind()
{
……
this.rpt_Review.DataSource = Dt;
this.rpt_Review.DataBind();
for (int i = 0; i < this.rpt_Review.Items.Count; i++)
{
LinkButton lbtn_Audit_eShop_Price = (LinkButton)this.rpt_Review.Items[i].FindControl("lbtn_Audit_eShop_Price");
if (Dt.Rows[i]["Audit_eShop_Price"].ToString() == "1")
{
lbtn_Audit_eShop_Price.Enabled = false;
lbtn_Audit_eShop_Price.Text = "已审核";
}
else
{
lbtn_Audit_eShop_Price.Enabled = true;
lbtn_Audit_eShop_Price.Attributes.Add("onclick",
"return lbtn_Audit_eShop_Price_Command(this, '" + Dt.Rows[i]["OrderId"].ToString() + "');");
}
}
}
[code]
2.用Ajax实现无刷新批量审核。
注意：这里用到的控件必须是Html控件，否则会引起回发。但在Repeater内部服务器控件也可以使用。
这里只需给input="btton"添加一个onclick属性，直接执行Ajax脚本。
脚本内容如下：
[code]
//批量审核
function Batch_Review()
{
if(!checkSelItem("OrderId","请选择订单！")) return false;
if(!confirm("确定要审核吗？")) return false;
var OrderIds = ""; //记录所有订单号
var elements = document.getElementsByName("OrderId");
for (var m=0; m < elements.length; m++){
if(m == elements.length - 1)
{
OrderIds = OrderIds + elements[m].value;
}
else
{
OrderIds = OrderIds + elements[m].value + ",";
}
}
var orderIdArr = OrderIds.split(',');
var newOrderIdStr = "";
var j = 0;//记录选择的订单个数
var position = "";//记录选择的订单位置
for(var i = 0;i<orderIdArr.length;i++)
{
var chk_Id = "OrderId_"+orderIdArr[i];
if($_Id(chk_Id).checked)//记录选中的订单
{
if(i == orderIdArr.length - 1)
{
newOrderIdStr += orderIdArr[i];
position += i;
}
else
{
newOrderIdStr += orderIdArr[i]+",";
position += i + ",";
}
j++;
}
}
newOrderIdStr = RemoveRightComma(newOrderIdStr);//去除末尾逗号后的订单号
position = RemoveRightComma(position);//去除末尾逗号后的位置
$.ajax({
type: "POST",
url: "AjaxTest.aspx",
data: { Order_Id_Arr: newOrderIdStr, Action: "Batch_Review" },
success: function(msg) {
if (msg != "") {
for(var k = 0 ;k<j;k++)
{
var newOrderIdArr = newOrderIdStr.split(',');
var positionArr = position.split(',');
$_Id("OrderId_"+newOrderIdArr[k]).disabled = "disabled";
if(parseInt(positionArr[k])<10)
{
$_Id("rpt_Review_ctl0"+parseInt(positionArr[k])+"_lbtn_Audit_eShop_Price").innerHTML = "已审核";
$_Id("rpt_Review_ctl0"+parseInt(positionArr[k])+"_lbtn_Audit_eShop_Price").disabled = "disabled";
}
else
{
$_Id("rpt_Review_ctl"+parseInt(positionArr[k])+"_lbtn_Audit_eShop_Price").innerHTML = "已审核";
$_Id("rpt_Review_ctl"+parseInt(positionArr[k])+"_lbtn_Audit_eShop_Price").disabled = "disabled";
}
}
}
}
})
return true;
}
//去除右边逗号
function RemoveRightComma(str)
{
if(str == "") return;
var i;
for(i = str.length-1;i>=0;i--)
{
//charAt(i)取某一个位置的字符
if(str.charAt(i) != ",") break;
}
//截取字符串，substring(start,stop);返回的结果不包含最后一位
str = str.substring(0,i+1);
return str;
}
至此实例讲解结束。
最后回顾思路：
1.单条审核：在页面初始化时，给审核按钮加上onclick属性，执行页面脚本，单击审核后，后台的page_load事件根据Action选择执行的事件。
2.批量审核: 给批量审核按钮加上onclick属性，执行Ajax脚本，后台的page_load事件同样根据Action选择执行的事件。批量审核按钮必须为Html控件。
标签：
Ajax运用
相思资源网 Design By www.200059.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
相思资源网 Design By www.200059.com
暂无Jquery之Ajax运用 学习运用篇的评论...
一口气升级7个大模型SaaS应用，百度智能云：突出一个“开箱即用” - 2024/11/19
这一波大模型产业落地浪潮里，不少企业其实处在 “干瞪眼“的状态。
一种情况是，很多大模型产品看得见却摸不着，在台上一个个遥遥领先——今天Sora技精四座，明天英伟达的机器人又赢得满堂彩，可是到了台下一问：啥时候能用上啊？答曰：遥遥无期。
另一种情况是，企业想用上大模型，却又难免瞻前顾后——既要考虑场景融合，又得兼顾安全性，还要考虑打通现有系统，再加上各种部署成本和繁琐的采购流程……最后只能拂袖：罢了，再等等吧。
这一波大模型产业落地浪潮里，不少企业其实处在 “干瞪眼“的状态。
一种情况是，很多大模型产品看得见却摸不着，在台上一个个遥遥领先——今天Sora技精四座，明天英伟达的机器人又赢得满堂彩，可是到了台下一问：啥时候能用上啊？答曰：遥遥无期。
另一种情况是，企业想用上大模型，却又难免瞻前顾后——既要考虑场景融合，又得兼顾安全性，还要考虑打通现有系统，再加上各种部署成本和繁琐的采购流程……最后只能拂袖：罢了，再等等吧。
稳了！魔兽国服回归的3条重磅消息！官宣时间再确认！
昨天有一位朋友在大神群里分享，自己亚服账号被封号之后居然弹出了国服的封号信息对话框。
这里面让他访问的是一个国服的战网网址，com.cn和后面的zh都非常明白地表明这就是国服战网。
而他在复制这个网址并且进行登录之后，确实是网易的网址，也就是我们熟悉的停服之后国服发布的暴雪游戏产品运营到期开放退款的说明。这是一件比较奇怪的事情，因为以前都没有出现这样的情况，现在突然提示跳转到国服战网的网址，是不是说明了简体中文客户端已经开始进行更新了呢？