JavaScript触发asp.net服务器端控件事件
【摘要】 当一个服务器控件要同时下列两种事时：
1.服务器端的点击事件
2.客户端的点击时执行ajax请求
需要的效果：
先执行ajax请求，然后根据ajax的结果，决定是否执行服务器的响应事件
当一个服务器控件同时执行这两种操作时，由于网速，响应速度，网络环境等多方面的因素，要么是后者的结果将前者的结果覆盖，要么是前者的结果将后者覆盖，这样很难达到所需要的效果。
于是，我想到了一个折...
当一个服务器控件要同时下列两种事时：
1.服务器端的点击事件
2.客户端的点击时执行ajax请求
需要的效果：
先执行ajax请求，然后根据ajax的结果，决定是否执行服务器的响应事件
当一个服务器控件同时执行这两种操作时，由于网速，响应速度，网络环境等多方面的因素，要么是后者的结果将前者的结果覆盖，要么是前者的结果将后者覆盖，这样很难达到所需要的效果。
于是，我想到了一个折中的办法。
一，将服务器控件“隐藏”(注意，如果直接将 服务器端控件的属于visiable = false 的话，那该控件直接会变成隐藏域，在客户端利用javascript操作他的时候会获取不到相应的id,所以可以这样来隐藏:width = “1px” height=”1px” 或者直接利用Div style=”display:none”)
二，在旁边生成一个客户端标签
三，为客户端标签写相应的ajax事件
四，当获取到相应的ajax结果时，执行模拟点击服务端的点击事件，具体请看如下代码
前台代码：
1 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="test" %> 2 3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 5 <html xmlns="http://www.w3.org/1999/xhtml"> 6 <script src="Scripts/jquery-1.4.1.js" type="text/javascript">script> 7 <head runat="server"> 8 <title>title> 9 <script type="text/javascript"> 10 window.onload = function () { 11 document.getElementById("btnok") 12 .onclick = function () { 13 $ 14 .post('Handler/Handler_title.ashx', { test: 'test' }, function (data) { 15 if (data == 'OK') { 16 //模拟鼠标点击服务器端控件 17 document.getElementById("<%=btn_ok.ClientID%>").click(); 18 } 19 }); 20 } 21 } 22 script> 23 head> 24 <body> 25 <form id="form1" runat="server"> 26 <div> 27 <asp:Button Text="服务器端button" ID="btn_ok" runat="server" 28 onclick="btn_ok_Click" width="1px" Height="1px"/> 29 <input type="button" value="客户端的button" id="btnok" /> 30 div> 31 form> 32 body> 33 html>
后台代码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class test : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void btn_ok_Click(object sender, EventArgs e) { Response.Write("服务器响应代码"); } }
文章来源: brucedone.com，作者：大鱼的鱼塘，版权归原作者所有，如需转载，请联系作者。
原文链接：brucedone.com/archives/339
【版权声明】本文为华为云社区用户转载文章，如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）