将 JavaScript 添加到服务器控件

最新推荐文章于 2024-08-14 15:45:18 发布

追风客之天下

最新推荐文章于 2024-08-14 15:45:18 发布

阅读量798

点赞数

分类专栏：计算机技术常识文章标签： javascript 服务器 button server html asp.net

计算机技术常识专栏收录该内容

14 篇文章 0 订阅

订阅专栏

将 JavaScript 添加到位于 ASP.NET 页面中的某个特定服务器控件是非常简单的。我们以按钮服务器控件为例。如果您使用任一 Microsoft Visual Studio 2005 将 Button HTML 服务器控件（HtmlInputButton 类）拖放到某个页面中，并将其作为服务器控件运行，则应具有以下代码结构：

<input id="Button1" type="button" value="button" runat="server" />

这是一个普通按钮，可通过 ASP.NET 页面的代码分离或服务器端脚本以编程方式对其进行控制。例如，要在生成页面时指定按钮文本，只需在该元素变成 HTML 服务器控件（右键单击该控件，然后选择 Run As Server Control（作为服务器控件运行））后使用该按钮的 value 属性即可。

protected void Page_Load(object sender, EventArgs e)
{
   Button1.Value = DateTime.Now.ToString();
}

这段代码只是在页面上提供了一个按钮，该按钮的文本为日期和时间。

图 1. 在按钮上显示日期和时间

需要特别注意的是，此处的 ASP.NET 页面是从生成该页面的服务器来获取时间的。因此，如果 Web 服务器位于美国中央时区 (CST -6 GMT) 的某个位置，则无论请求此页面的人位于何处，他们都将获得相同的时间。

如果想要此按钮显示查看该页面的人所在时区的时间，又该如何呢？完成此项任务的最简单方法就是在客户端使用 JavaScript。

就此列举一例，我们要将终端用户（Web 页面的查看者）的计算机时间置于一个按钮 Web 服务器控件上。以下代码显示了如何完成该任务：

<%@ Page Language="C#" %>

<script runat="server">
    protected void Button1_Click(object sender, EventArgs e)
    {
        Response.Write("回发！");
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>使用 JavaScript</title>
</head>
<body οnlοad="javascript:document.forms[0]['Button1'].value=Date();">
    <form id="form1" runat="server">
    <div>
        <asp:Button ID="Button1" runat="server" Text="按钮" 
         OnClick="Button1_Click" Font-Bold="True" Font-Names="Verdana" 
         Font-Size="Larger" />
    </div>
    </form>
</body>
</html>

在此小段代码中，要注意按钮的一些属性在被发送到客户端浏览器之前是如何指定给服务器端的。本例中，按钮上文本的字体被更改为具有特定大小的粗体 Verdana。客户端接收到按钮的 HTML 代码后，客户端 JavaScript 即会将该按钮的文本更改为终端用户计算机上的当前时间。针对整个页面生成的 HTML 代码如下：

<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>
   使用 JavaScript
</title></head>
<body οnlοad="javascript:document.forms[0]['Button1'].value=Date();">
    <form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" 
 value="/wEPDwUKMTY3NzE5MjIyMGRkVUxVdzEWBhD7U89t7JKIkQc6Cko=" />
</div>

    <div>
        <input type="submit" name="Button1" value="" id="Button1" 
         style="font-family:Verdana;font-size:Larger;font-weight:bold;" />
    </div>
    
<div>

   <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" 
    value="/wEWAgK394SHCAKM54rGBtsX8d2S8MO7sf02DOAiquFyBkeY" />
</div></form>
</body>
</html>

单击该按钮仍会出现一个回发（通过 Response.Write 命令查看），当重新呈现此页面时，按钮控件上会显示新时间。结果如图 2 所示。

图 2. 单击日期按钮

在本例中，我们通过 onload 属性将一些 JavaScript 直接置于页面的 <body> 元素中。对于 onload 属性的值，我们特意指向了第一个 <form> 节（因为在 HTML 中可能会有多个 form）中名为 Button1 的 HTML 元素。

<%@ Page Language="C#" %>

<script runat="server"> 
    protected void Page_Load(object sender, EventArgs e)
    {
        Button1.Attributes.Add("onclick", 
           "javascript:alert('多加注意！！！')");
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>使用 JavaScript</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button id="Button1" runat="server" Font-Bold="True" 
         Font-Names="Verdana" Font-Size="Larger" 
         Text="单击我！"></asp:Button>
    </div>
    </form>
</body>
</html>

使用服务器控件的 attribute 属性将附加的 JavaScript 添加到控件特定的控件是一种很好的方式。本例中，通过将 Attribute.Add 属性与脚本关键字和脚本本身（两者均表示为字符串值）配合使用添加了 JavaScript。

追风客之天下

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
将 JavaScript 添加到服务器控件

将 JavaScript 添加到位于 ASP.NET 页面中的某个特定服务器控件是非常简单的。我们以按钮服务器控件为例。如果您使用任一 Microsoft Visual Studio 2005 将 Button HTML 服务器控件（HtmlInputButton 类）拖放到某个页面中，并将其作为服务器控件运行，则应具有以下代码结构：这是一个普通按钮，可通过 ASP.NET 页面的代码
复制链接

扫一扫

专栏目录