ASP.NET中注册客户端脚本的三种方式

简介: 1. RegisterClientScriptBlock   把Javascript函数放在页面顶部 代码如下: protected void Page_Load(object sender, EventArgs e){  string myScript = @"function Ale...

1. RegisterClientScriptBlock

  把Javascript函数放在页面顶部

代码如下:

protected   void  Page_Load( object  sender, EventArgs e)
{
  
string  myScript  =   @" function AlertHello() { 
                      var oText = document.getElementById('TextBox1');
                      alert(oText.value); }
" ;
  Page.ClientScript.RegisterClientScriptBlock(
this .GetType(),
               
" MyScript " , myScript,  true );
}

 

生成的html代码如下:

< html  xmlns ="http://www.w3.org/1999/xhtml"   >
...
< body >
< form >

... 
 
< script  type ="text/javascript" >  
// <![CDATA[
function  AlertHello() { 
  
var  oText  =  document.getElementById ( ' TextBox1 ' );
  alert(oText.value); }
// ]]>
</ script >
        
< input  name ="TextBox1"  type ="text"   id ="TextBox1"   />
< input  type ="submit"  name ="Button1"  value ="Button"  onclick ="AlertHello();"  id ="Button1"   />
       
...
 
</ form >
</ body >
</ html >

 

2. RegisterStartupScript

把Javascript函数放在页面底部

代码如下:

protected   void  Page_Load( object  sender, EventArgs e)
{
  
string  myScript  =   @" document.getElementById('TextBox1').value = 'Hello ASP.NET.';
                      var oText = document.getElementById('TextBox1');
                      alert(oText.value); 
" ;
  Page.ClientScript.RegisterStartupScript(
this .GetType(),
               
" MyScript " , myScript,  true );
}

 

 

生成的html代码如下:

< html >
...
< body >
< form >

...        

< input  name ="TextBox1"  type ="text"  id ="TextBox1"   />
    
< script  type ="text/javascript" >  
// <![CDATA[
document.getElementById( ' TextBox1 ' ).value  =   ' Hello ASP.NET. ' ;
var  oText  =  document.getElementById( ' TextBox1 ' );
alert(oText.value); 
// ]]>
</ script >

</ form >
</ body >
</ html >

 

3. RegisterClientScriptInclude

注册外部的Javascript脚本文件

代码如下:

protected   void  Page_Load( object  sender, EventArgs e)
{
  
string  myScript  =   " ../JS/myJavaScriptCode.js " ;
  Page.ClientScript.RegisterClientScriptInclude(
" MyScript " , myScript);
}

 

Javascript代码如下:

function  AlertHello() {
    
var  oText  =  document.getElementById( ' TextBox1 ' );
    alert(oText.value);
}

 

HTML中调用如下:

<asp:Button ID="Button1" Runat="server" Text="Button"
            OnClientClick="AlertHello()" />

 

它也是把script脚本放在代码底部

 

目录
相关文章
|
1月前
|
存储 Shell Linux
快速上手基于 BaGet 的脚本自动化构建 .net 应用打包
本文介绍了如何使用脚本自动化构建 `.net` 应用的 `nuget` 包并推送到指定服务仓库。首先概述了 `BaGet`——一个开源、轻量级且高性能的 `NuGet` 服务器,支持多种存储后端及配置选项。接着详细描述了 `BaGet` 的安装、配置及使用方法,并提供了 `PowerShell` 和 `Bash` 脚本实例,用于自动化推送 `.nupkg` 文件。最后总结了 `BaGet` 的优势及其在实际部署中的便捷性。
77 10
|
11月前
|
Linux Android开发 iOS开发
基于.Net开发的ChatGPT客户端,兼容Windows、IOS、安卓、MacOS、Linux
基于.Net开发的ChatGPT客户端,兼容Windows、IOS、安卓、MacOS、Linux
170 0
|
监控 物联网 API
【.NET+MQTT】.NET6 环境下实现MQTT通信,以及服务端、客户端的双边消息订阅与发布的代码演示
MQTT广泛应用于工业物联网、智能家居、各类智能制造或各类自动化场景等。MQTT是一个基于客户端-服务器的消息发布/订阅传输协议,在很多受限的环境下,比如说机器与机器通信、机器与物联网通信等。好了,科普的废话不多说,下面直接通过.NET环境来实现一套MQTT通信demo,实现服务端与客户端的双边消息发布与订阅的功能和演示。
1255 0
【.NET+MQTT】.NET6 环境下实现MQTT通信,以及服务端、客户端的双边消息订阅与发布的代码演示
|
9天前
|
网络协议 Unix Linux
一个.NET开源、快速、低延迟的异步套接字服务器和客户端库
一个.NET开源、快速、低延迟的异步套接字服务器和客户端库
|
14天前
|
存储 消息中间件 NoSQL
Redis 入门 - C#.NET Core客户端库六种选择
Redis 入门 - C#.NET Core客户端库六种选择
48 8
|
4月前
|
NoSQL 大数据 Redis
分享5款.NET开源免费的Redis客户端组件库
分享5款.NET开源免费的Redis客户端组件库
|
5月前
|
JSON 编解码 Go
Golang深入浅出之-HTTP客户端编程:使用net/http包发起请求
【4月更文挑战第25天】Go语言`net/http`包提供HTTP客户端和服务器功能,简化高性能网络应用开发。本文探讨如何发起HTTP请求,常见问题及解决策略。示例展示GET和POST请求的实现。注意响应体关闭、错误处理、内容类型设置、超时管理和并发控制。最佳实践包括重用`http.Client`,使用`context.Context`,处理JSON以及记录错误日志。通过实践这些技巧,提升HTTP编程技能。
72 1
|
5月前
|
Go 开发者
Golang深入浅出之-HTTP客户端编程:使用net/http包发起请求
【4月更文挑战第24天】Go语言的`net/http`包在HTTP客户端编程中扮演重要角色,但使用时需注意几个常见问题:1) 检查HTTP状态码以确保请求成功;2) 记得关闭响应体以防止资源泄漏;3) 设置超时限制,避免长时间等待;4) 根据需求处理重定向。理解这些细节能提升HTTP客户端编程的效率和质量。
63 1
|
5月前
|
SQL 开发框架 .NET
ASP.NET Web——GridView完整增删改查示例(全篇幅包含sql脚本)大二结业考试必备技能
ASP.NET Web——GridView完整增删改查示例(全篇幅包含sql脚本)大二结业考试必备技能
79 0
|
11月前
|
缓存 NoSQL 大数据
4款.NET开源的Redis客户端驱动库
4款.NET开源的Redis客户端驱动库
126 0