ASP.NET中注册客户端脚本的三种方式
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);
}
{
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>
...
<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);
}
{
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>
...
<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);
}
{
string myScript = "../JS/myJavaScriptCode.js";
Page.ClientScript.RegisterClientScriptInclude("MyScript", myScript);
}
Javascript代码如下:
function AlertHello() {
var oText = document.getElementById('TextBox1');
alert(oText.value);
}
var oText = document.getElementById('TextBox1');
alert(oText.value);
}
HTML中调用如下:
<asp:Button ID="Button1" Runat="server" Text="Button"
OnClientClick="AlertHello()" />
它也是把script脚本放在代码底部
技术改变世界