2019独角兽企业重金招聘Python工程师标准>>>

Net是微软公司下一代的战略核心,ASP.Net是.Net战略在Web开发方面的具体实现。它继承了ASP的简单性和易用性,同时克服了ASP程序结构化较差,难于阅读和理解的缺点。特别是服务器端控件和事件驱动模式的引入,使得Web应用程序的开发更接近于过去桌面程序的开发。

在各种各样介绍ASP.Net的文章和书籍中,都把重点放在了服务器控件和.Net Framework SDK上,因为这是ASP.Net中最新和最具革命性的改进;与此相反,在过去的Web开发中占据重要地位的客户端脚本Javascript(也包括VBScript)则鲜有提及,似乎有了服务器端程序,已经不需要客户端脚本了。但是,服务器端的程序毕竟需要一次浏览器与Web服务器的交互,对于ASP.Net来说,就是一次页面的提交,需要来回传送大量的数据,而很多工作,比如输入验证或者删除确认等,完全可以用Javascript来实现。因此,探讨在ASP.Net中如何使用Javascript仍然很有必要。 Javascript的应用示例

1.为页面上的某个服务器控件添加Javascript事件

服务器控件最终生成的仍然是普通的HTML,比如asp:textbox生成input text。表单中的每个HTML控件都有它自己的Javascript事件,比如Textbox有onchange事件,Button有onclick事件,Listbox有onchange事件等。要想为服务器控件添加客户端的事件,需要用到Attributes属性。Attributes属性是所有的服务器控件都有的一个属性,它用来为最终生成的HTML添加自定义的一些标记。假设Web Form上有一个保存按钮btnSave,希望在用户点此按钮时提示用户是否确实要保存(比如一旦保存就无法恢复等),则应在Page_Load事件中添加如下代码:

if not page.isPostBack() then

btnSave.Attributes.Add(“onclick”,”Javascript:return confirm(‘Are you sure to save?’);”) nd if

要注意的是‘return’,这是不可省的,否则即使用户点了取消,数据仍然会保存。

2.为Datagrid中的每一行添加Javascript事件

假设Datagrid的每一行有一个删除按钮,希望在用户点此按钮时提示用户是否确实要删除此条记录,以防用户点错了行,或仅仅是无意中点了删除按钮。

无论这个删除按钮是什么名字,都不能象上个例子那样直接引用,因为每一行都有这样一个按钮,它们是Datagrid中的子控件。在这种情况下,需要用到Datagrid的OnItemDataBound事件。OnItemDataBound事件发生在Datagrid的每一行数据绑定到Datagrid之后(即一行激发一次)。首先在Datagrid的声明中添加如下代码:

<asp:datagrid id="grd1" runat="server" OnItemDataBound = "ItemDataBound" > …Columns definition here

</asp:datagrid> 此处说明OnItemDataBound事件发生时调用ItemDataBound方法,在代码后置文件中添加此方法的定义:

Sub ItemDataBound(ByVal sender As Object, ByVal e As DataGridItemEventArgs)

If e.Item.ItemType <> ListItemType.Header And e.Item.ItemType <> ListItemType.Footer Then

Dim oDeleteButton As LinkButton = e.Item.Cells(5).Controls(0)

oDeleteButton.Attributes("onclick") = "javascript:return Confirm ('Are you sure you want to delete" & DataBinder.Eval(e.Item.DataItem, "m_sName") & "?')" End If

End Sub

由于Datagrid的标题行和脚注行也会激发此事件,所以首先判断激发此事件的行不是标题行和脚注行。

这里假设Delete按钮位于Datagrid的第6列(第一列是0),且Datagrid的Datasource中包含名为”m_sName”的列

3.引用编辑状态下的Datagrid中的控件

Datagrid的内置编辑功能使得当记录的字段较少时的一种编辑方法。用户不必进入一个单独的页面编辑记录,而是直接点编辑按钮就可以使当前行进入编辑模式。而另一方面,有一些Javascript程序需要引用控件的名称。比如,很多程序在需要用户输入日期时都提供一个日期控件以保证日期格式的合法性,当用户点控件图标时弹出一个新窗口供用户选择日期。此时需要把显示日期的文本框的ID提供给新窗口,以便当用户选择日期后值可以回填到文本框中。

如果是普通的服务器文本框控件,它的ID与生成的HTML输入框的ID是相同的;但是在Datagrid的编辑状态下,两个ID并不相同(其道理与上例相同),这就需要用到控件的ClientID属性。

Protected Sub ItemEdit(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs)

Dim sDateCtrl as string

sDateCtrl = grd1. Items (e.Item.ItemIndex) . Cells(2). FindControl("txtDate") . ClientID

End Sub

这里假设ItemEdit方法是Dategrid的OnItemEdit事件处理程序,同时在Datagrid的第三列包含一个名为txtDate的服务器文本框控件。

4.引用ASP.Net自动生成的Javascript程序

所谓的“服务器端控件”是针对开发人员的,在生成的HTML源程序中并没有服务器和客户端之分,都是标准的HTML,DHTML和Javascript。它之所以能响应用户的输入是因为每个控件的事件处理程序最终都生成了一段脚本,此脚本重新提交页面使得Web Server有机会再次响应并作出处理。通常情况下我们不必知道此脚本是什么也不必直接调用此脚本,但在有些情况下,适当地调用此脚本可以简化许多工作。请看下面两个例子。 点Datagrid的任一位置以选中一行

Datagrid提供了一种内置的选择按钮,当点此按钮时选中当前行(可以设置SelectedItemStyle属性以使当前行有不同的外观)。但用户可能更习惯于点任意一个位置都能选中一行,如果完全自己实现这个功能相当烦琐。一个好的思路是添加一个选择按钮,但使此列隐藏,当点任一行时调用此按钮产生的Javascript脚本。

Sub Item_Bound(ByVal sender As Object, ByVal e As DataGridItemEventArgs )

Dim itemType As ListItemType

itemType = CType(e.Item.ItemType, ListItemType)

If (itemType <> ListItemType.Header) And _ (itemType <> ListItemType.Footer) And _

(itemType <> ListItemType.Separator) Then

Dim oSelect As LinkButton = CType(e.Item.Cells(5).Controls(0), LinkButton)

e.Item.Attributes("onclick") = Page. GetPostBackClientHyperlink (oSelect, "") End Sub

这里假设选择按钮位于第6列。e.Item代表了一行,从生成的HTML上看就是在每个<tr>里增加了一个onclick事件。Page.GetPostBackClientHyperLink方法返回页面中LinkButton控件产生的客户端脚本,其中第一个参数是Linkbutton控件,第二个参数是传递给此控件的参数,通常为空。如果不是LinkButton控件,有一个类似的函数GetPostBackClientEvent,读者可以参考MSDN。

● 服务器产生的脚本与手工添加的脚本冲突

服务器控件的服务器事件一般对应到客户端控件的相应事件,如Dropdownlist的SelectedIndexChanged事件对应HTML <Select>的onchange事件。 如果你要手工增加一个onchange事件,则会在客户端产生两个onchange,浏览器就会忽略掉一个。比如用户希望每当改变了Dropdownlist中的选项就保存到数据库(虽然不是很常见,但确实有这种需要),但同时还希望提醒用户是否确实要做保存。显然,保存的代码应该放在SelectedIndexChanged事件中,而提醒的工作应该手工加一段onchange事件。结果就是两个onchange只能执行一个。正确的方法应该是添加一个不可见的保存按钮,在手工增加的onchange事件中调用此按钮生成的程序。

Page_Load方法如下:

Dim sCmd as string

sCmd=Page.GetPostBackClientHyperlink(btnUpdate, "")

If not page.isPostback then

Dropdownlist1.Attributes.add("onchange","ConfirmUpdate(""" & sCmd & """)")

End if

ConfirmUpdate函数如下

<Script language=”javascript”> function ConfirmUpdate(cmd){ if confirm(“Are you sure to update?”) eval(cmd); } </Script>

这里利用了Javascript eval函数来调用一个字符串中包含的命令。需注意的是包含命令的字符串不能用单引号括起来,因为自动生成的脚本中包括单引号,所以这里用两个双引号表示字符串本身的双引号。

三、结束语

以上简单讨论了在ASP.Net中插入Javascript的几种情况。合理地在服务器程序中插入客户端的Javascript脚本,可以提高程序的运行效率并提供更友好的用户界面 end,可以试一下

转载于:https://my.oschina.net/bigfool007139/blog/403534

javascript在asp.net中运用相关推荐

  1. 利用JavaScript在ASP.NET中动态生成系统菜单

      用户在登陆一个系统后通常会因为权限的不同而使用不同的系统功能,我们在实现用户使用的菜单项时有两种选择,一是列出全部系统菜单项,根据用户的权限禁用一部分菜单,二是根据权限动态加载菜单,这样只要列出的 ...

  2. 在asp.net中如何用javascript读取本地Xml中的数据到网页中的文本框?

    在asp.net中如何用javascript读取本地Xml中的数据到网页中的文本框? 转载于:https://www.cnblogs.com/dynasty/archive/2005/08/18/21 ...

  3. 在ASP.NET中利JavaScript实现控件的聚焦

    在Windows应用程序中很容易控制控件的聚焦,但是在ASP.NET中并没有提供这样的功能,但是我们同样可以实现这样的功能,这篇文章就讲述了通过JaveScript实现在页面上某一特定控件获得焦点的功 ...

  4. asp.net中的联动菜单

    目标达到的效果:两个下拉框,第二个跟随第一个变化而变化,使用客户端脚本JavaScript在ASP.NET环境下实现. 第一步:建立JavaScript脚本: 在Page_Load中建立并注册这个js ...

  5. 在asp.net中使用客户端脚本

    我们常常在asp.net中需要使用到客户端脚本,在asp.net中使用客户端脚本很容易,使用到Page的RegisterClientScriptBlock方法就行了.下面是我写的一段C#代码,用来打开 ...

  6. 在 ASP.NET 中执行 URL 重写

    在 ASP.NET 中执行 URL 重写 发布日期: 8/23/2004 | 更新日期: 8/23/2004 Scott Mitchell 4GuysFromRolla.com 适用范围: Micro ...

  7. Asp.net中GridView使用详解(引)【转】

    Asp.net中GridView使用详解(引) GridView无代码分页排序 GridView选中,编辑,取消,删除 GridView正反双向排序 GridView和下拉菜单DropDownList ...

  8. .NET技术 ASP.NET中常用的文件上传下载方法(多文件上传)

    文件的上传下载是我们在实际项目开发过程中经常需要用到的技术,这里给出几种常见的方法,本文主要内容包括: 1.如何解决文件上传大小的限制 2.以文件形式保存到服务器 3.转换成二进制字节流保存到数据库以 ...

  9. Asp.Net中验证控件简单分析

    为了实现验证,.net提供了一个javascript脚本,当我们生成一个asp.net页面时,通过查看页面源代码的方式,会发现都调用了下面一个javascript文件: <script src= ...

最新文章

  1. 郑州网络推广浅谈网站首页在优化时都需要注意哪些细节呢?
  2. [转载]为什么使用 SLF4J 而不是Log4J来做Java 日志
  3. 校园技术工坊丨云开发校园执行官招募开启!
  4. 前方危险-让很多“高逼格”高管深刻反思的文章
  5. seo提交工具_经验分享:SEO新手面对新网站应该如何去优化
  6. [转]从根上理解高性能、高并发:深入计算机底层,理解线程与线程池
  7. Java基础知识强化87:BigInteger类之BigInteger加减乘除法的使用
  8. 6.Jenkins 权威指南 --- 高级构建
  9. 想去机器学习初创公司做数据科学家?这些问题值得你三思!
  10. 商务统计_6 用图表演示数据 - 定性数据
  11. 2017年笔记本计算机行业,2017笔记本电脑最新排行榜
  12. 2022香港ib成绩公布,实在是太高了
  13. Matlab 多项式展开或化简(即提取公因式
  14. 中柏平板u盘启动_中柏笔记本一键U盘重装系统教程图解
  15. Agarose bound-WFA,WFL;琼脂糖结合紫藤凝集素(WFA,WFL)
  16. ASEMI整流二极管10A10参数,10A10压降,10A10作用
  17. 白菜一斤八毛用计算机怎么算,6毛一斤的大白菜,一买好几颗,12种做法换着吃...
  18. 有关ucenter同步的原理(个人总结的一点浅薄见解)
  19. 数据分析-如何搭建业务指标体系
  20. 一文深入分析|RCU原理

热门文章

  1. Jmeter3.1官方自带的HTML图形测试报告 + 汉化
  2. HDU 1568 Fibonacci【求斐波那契数的前4位/递推式】
  3. 一个PHP压缩类,在线压缩文件
  4. 81-linux cluster : lvs
  5. 内存映射与DMA笔记
  6. 就像教育一样,本身作用巨大,当过度强化,就是扭曲了~
  7. android之appwidget(一)简单appwidget
  8. Eclipse最新插件的下载地址大全[收集整理] zt
  9. Starter Kit for ASP.NET 2.0 家族又添新丁!
  10. java获取当前日期时间_Java日期时间API系列10-----Jdk8中的DateTimeFormatter