1.后台代码调用前台JS代码

一、说到后台代码调用前台的JS代码很多人首先就会想到使用Clientscript对象。

　　Clientscript.RegisterStartups cript()方法，该方法主要是注册启动脚本文本，即在后台执行调用前台JS代码

　　该方法有两个重载，

1、Clientscript.RegisterStartupscript（Type type,string key ,string script）

注册启动脚本//分别表示：

1、要注册的启动脚本的类型（一般直接填this.GetType()即可），

2、要注册的启动脚本的键（相当于为执行脚本起一个名字,任意名即可），

3、要注册的启动脚本文本（一般为"<script>函数（）</script>")；

示例：

Clientscript.RegisterStartupscript(this.GetType(),"SayHello","<script>SayHello('"+name+"')</script>");//先获取用户姓名，然后再调用前台的JS函数SayHello(name);

2、Clientscript.RegisterStartupscript(Typetype,string key, string script,bool flag);//该函数和第一参数的区别在于将最后一个参数设为"ture"时，第三个参数可以直接写被调用的函数，不用再加"<script></script>",这两个方法差别不是很大。

示例：

Clientscript.RegisterStartupscript(this.GetType(),"SayHello1", "SayHello('" + name + "')", true);//跟第一方法的效果一样，调用前台SayHello(name)函数，如果最后一个值设为false，则仍需添加上"<script></script>"标记

这里需要特别注意的是在注册启动脚本的时候，键是唯一的，不能重复，如果有将会报错。

二、使用Clientscript.RegisterClientscriptBlock()方法，注册客户端脚本块

该方法有两个重载，使用方法几乎和Clientscript.RegisterClientscriptBlock()的两个方法一模一样。这里只是给出示例，就不再做过多的解释。

Clientscript.RegisterClientscriptBlock(this.GetType(),"SayHello2", "ShowPerson('" + age + "')",true);

Clientscript.RegisterClientscriptBlock(this.GetType(),"SayHello2","<script>SayHello('"+name+"')</script>");

在这里主要讲一下RegisterClientscriptBlock方法和RegisterStartupscript方法和区别

RegisterStartupscript，这种方法会把JS代码嵌入在页面的底部、表单的最后 (</form>前面)，适用于要在页面控件加载完成后运行的JS代码

RegisterClientscriptBlock，这种方法会把JS代码嵌入在页面的顶部、表单的最前 (<form>后面)，适用于要在控件加载前执行的JS代码

三、使用Control.Attribute属性（服务器控件）

这也是一种比较简单好用的方法，可以将该方法和控件的客户端方法相关联，比如“onblur，onfocus，onmousemove，onmouseover“等，在这里只是把该方法作为Control的一个属性来用。

示例：

在Page_Load（）方法里添加如下代码：

txtname.Attributes["onblur"] ="show('" + txt.Text + "')";//当用户离开文本框时，会提示所输入的内容（在Page_Load使用该方法，其实是在编译成源文件时在对应的html元素的属性调用js函数，如<inputtype=”text” onblur=”show()”/>）

还可以通过这种方法来控制前台的显示。其实现方法和本例的方法都是一样的，在这里就不做过多的介绍了。

四、可以使用Control的一个属性，（服务器控件），OnClientClick

为该属性赋值OnClientClick="SayHello()";则就会调用客户端的方法，该方法的本质就是一个客户端的方法。（该属性只有服务器控件具有，在编译成源文件时，其实是转换成对应的事件，如OnClientClick会转换成onclick）

示例：

<asp:Button ID="Button1" runat="server"OnClientClick="Get()" Text="OnClientClick方法测试"/>

五、示例

前台js
<script type="text/javascript" language="javascript">
　　function Ceshi()
　　{
　　　　var a = "你们好啊！"
　　　　alert(a);
　　}
</script>
<asp:Button ID="Button1" runat="server" Text="后台调用js" onclick="Button1_Click" />

后台代码
protected void Button1_Click(object sender, EventArgs e)
{
　　　　//如果有UpdatePanel就用如下代码调用前台js
　　　　ScriptManager.RegisterStartupScript(UpdatePanel1, this.Page.GetType(), "", "Ceshi();", true);
　　　　//如果没有就如下代码
　　　　this.Page.ClientScript.RegisterStartupScript(this.Page.GetType(), "", "<script language='javascript'>Ceshi();</script>", false);
}

public void RegisterStartupScript(
Type type,
string key,
string script,
bool addScriptTags //false :要标记脚本标记
)
type
要注册的启动脚本的类型。
key
要注册的启动脚本的键。
script
要注册的启动脚本文本。
addScriptTags
指示是否添加脚本标记的布尔值。

2.前台JS调用后台方法

一、最简单的一种方式，在前台的JS函数中写下如下代码：

Var name=<%=SayHello()%>

在Asp.NET 以前的ASP就是通过这样的方式将cs代码写到apsx页的，在<% %>中就可以写cs代码了，效果跟在cs页写一样。

在前台页面<head><head>节点中添加如下代码：

function Get() {

var hello="<%=SayHello() %>";

alert(hello);

}

</s cript>

后台cs页代码如下：

public string SayHello()

{

return " Javas cript调用后台代码显示姓名： Olive";

}

结果：

二、通过辅助按钮实现前台JS调用后台代码（这样相当于添加多了一个按钮）

1、先在前台添加一个服务器端按钮，双击，进入后台.cs页，写下将要执行的代码

如下：

protected void Button4_Click(object sender,EventArgs e) {

//在此方法里写下要执行的代码，此处为简单的示例

Response.Write("<s cript>alert('O(∩_∩)O哈哈~你好！')</s cript>");

}

2、将该按钮的Width属性设为0，将Height属性设为0，形如

<asp:Button ID="btnhoutai" runat="server"Text="" Width="0"Height="0"

onclick="Button4_Click" />

3、在前台添加一个JS函数，如下：

function Show1() {

document.getElementById("btnhoutai").click();

}

4、添加html按钮并将其onclick="Show1()";

如下：

经过以上这四步就可以实现JS调用后台的代码了。

ASP.NET 前后台调用