ASP.NET拾萃——服务器端控件篇(二)

<script type="text/javascript"> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>
<script type="text/javascript"> </script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>
技巧二:掌握控件的客户端属性及事件

经常在网上看到类似的问题:如何让ASP.NET服务器端控件响应客户端事件?

ASP.NET服务器端控件能够响应服务器端事件,使我们能够像编写Windows程序一样编写网页。可有时我们并不需要让客户端运行的控件和服务器发生交互,这样做的开销是很大的:不仅占用网络带宽、服务器的CPU资源,还会产生一次PostBack导致客户端浏览器“刷新”影响界面效果。
如果直接在Web窗体的HTML代码内为服务器端控件添加客户端事件代码,就像这样:
<ASP:Button id="Button1" OnClick="window.alert('按钮被按下了')" Text="按钮1"/>

你会发现,当按下这个按钮时,并没有预定的消息框弹出,而是直接执行服务器端代码内的响应按钮按下事件的Button1_Click方法(假设我们已经为按钮绑定了这个事件)。如果查看客户端页面的源代码,按钮的OnClick事件里,根本没有自己写的代码,却变成了"JavaScript:__doPostBack(...)"。
其实这正是.NET Framework转换工作的一部分。有了这个"JavaScript:__doPostBack(...)",才能实现按钮提交、服务器端响应事件等一系列动作。(关于这段自动加上的脚本,我会在今后的文章里详细说明。)
想要控件在客户端就响应事件,必须另寻他法。好在.NET已经为我们提供了丰富的接口去实现这些功能。
所有的服务器端控件(Button、Label、TextBox……)都有一个属性Attributes——这是一个很重要的属性,它是服务器端控件在客户端对应HTML元素属性及事件的集合。有了它,我们能够自定义服务器端控件在客户端的行为、外观。
还是刚才的Button1,这次我们在Page_Load事件里加上这么一句(在IsPostBack判断之外):
Button1.Attributes.Add("onclick", "window.alert('按钮被按下了')");

重新生成项目之后再次浏览页面,这次我们终于能够看到“按钮被按下”的消息框被正常弹出了。
回过头来解释这句代码:Attributes是Button1也是所有服务器端控件拥有的属性,Add(...)是Attributes所属的一个方法,作用是为控件在客户端的HTML标记内添加代码,第一个参数是属性的名称,第二个参数是属性的值。在这里我们为按钮的onclick事件添加了一段弹出消息框的代码。在客户端查看页面源代码,可以看到按钮的onclick事件里包含了这段代码(.NET Framework自动生成的"__doPostBack(...)"就跟在后面,我们使用Add就是告诉.NET Framework:“先加入我们的代码!”)。

Attributes还有另一种访问的形式(C#专用):
Button1.Attributes["onclick"] = "window.alert('按钮被按下了')"; // []内是属性的名称,等号右边就是属性的值

这个方法同样可以用于使用服务器端代码为控件改变属性:
Button1.Attributes["style"] = "fontsize: 9pt"; // 改变控件样式的字体为9磅
<script type="text/javascript"> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>
<script type="text/javascript"> </script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值