| JavaScript和ASP.NET之间的传值 | 您所在的位置：网站首页 › asp页面传值 › JavaScript和ASP.NET之间的传值 |
JavaScript和ASP.NET之间的传值
|
C#代码与javaScript函数的相互调用：
1.如何在JavaScript访问C#函数?
javaScript函数中执行C#代码中的函数： 方法一：页面和页面类相结合 1、函数声明为public ， 后台代码(把public改成protected也可以) 2、在html里用可以调用//是C#中后台的函数名称  
1 C#后台的函数
2 public string ss()
3 {
4 return("a");
5 }
6
7 前台脚本
8
9
10 var a = "";//JavaScript中调用C#后台的函数
11 alert(a);
12
View Code
方法二： JavaScript异步调用定义在ASP.Net页面中的方法 1.将该方法声明为公有(public); 2.将该方法声明为类方法(C#中的static,VB.NET中的Shared),而不是实例方法; 3.将该方法添加【WebMethod】属性 4.将页面中ScriptManager控件的EnablePageMethods属性设置为true; 5.在客户端使用如下JavaScript语法调用该页面方法 PageMethods.[MethodName](param1,param2,...,callbackFunction); 6.为客户端异步调用指定回调函数,在回调函数中接受返回值并进一步处理; 7.添加 using System.Web.Services;
1 前台JavaScript代码
2
3
4 < head runat="server">
5 无标题页
6
7 function JsCallCSharp(param1)
8 {
9 PageMethods.sayhell(param1,onSayHelloSucceeded);//sayhell是后台标注了【webMethod】属性的方法 param1是传入该方法的参数，onSayHelloSucceeded是回调函数主要是对后台返回的结果进一步处理
10 }
11 function onSayHelloSucceeded(result)//绑定的回调函数
12 {
13 alert(result);
14 }
15
16
17
18
19 < body>
20
21 //ScriptManager控件管理脚本的，
22
23 注意设置EnablePageMethods="true"此属性
24
25
26
27
28
29 < /body>
30 < /html>
31 后台代码（.cs文件）
32 using System;
33 using System.Configuration;
34 using System.Data;
35 using System.Linq;
36 using System.Web;
37 using System.Web.Security;
38 using System.Web.UI;
39 using System.Web.UI.HtmlControls;
40 using System.Web.UI.WebControls;
41 using System.Web.UI.WebControls.WebParts;
42 using System.Xml.Linq;
43 using System.Web.Services;//添加web服务引用
44
45 public partial class _Default : System.Web.UI.Page
46 {
47 protected void Page_Load(object sender, EventArgs e)
48 {
49
50
51 }
52 [WebMethod]//标示为web服务方法属性
53 public static string sayhell(string say)//注意函数的修饰符,只能是静态的
54 {
55 return say;
56 }
57 }
View Code
方法三： JavaScript异步调用定义在Web服务类中的方法 1.添加一个web服务标示该服务为 允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务 对应属性为[System.Web.Script.Services.ScriptService] 2.将该方法声明public并将该方法标示为[webMethod]属性方法 3.在页面中ScriptManager控件并添加web服务引用 4.在客户端使用如下JavaScript语法调用web服务方法 WebService.HelloWorld("helloWord",function(res)//Webservice是web服务页面名称 HelloWord为web服务页面类中的方法，function为回调JavaScript函数主要是处理返回的结果
1 页面代码
2
3
4 < head runat="server">
5 无标题页
6
7
8 function JsCallCSharp(param1)
9 {
10 PageMethods.sayhell(param1,onSayHelloSucceeded);
11 }
12 function onSayHelloSucceeded(result)
13 {
14 alert(result);
15 }
16
17 //该方法为调用的函数
18 function JsCallWebService()
19 {
20 WebService.HelloWorld("helloWord",function(res)//调用web服务
21 {
22 alert(res);
23 });
24 }
25
26
27
28 < body>
29
30
31 //注意要引用web服务
32
33
34
35
36
37
38 < /body>
39 < /html>
40
41 web服务后台代码
42
43 using System;
44 using System.Collections;
45 using System.Linq;
46 using System.Web;
47 using System.Web.Services;
48 using System.Web.Services.Protocols;
49 using System.Xml.Linq;
50
51 ///
52 ///WebService 的摘要说明
53 ///
54 [WebService(Namespace = "http://tempuri.org/")]
55 [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
56 //若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
57 [System.Web.Script.Services.ScriptService]//注意要添加该标示
58 public class WebService : System.Web.Services.WebService {
59
60 public WebService () {
61
62 //如果使用设计的组件，请取消注释以下行
63 //InitializeComponent();
64 }
65
66 [WebMethod]//方法要标示的属性
67 public string HelloWorld(string result) {
68 return result;
69 }
70 }
View Code
1 方法一：使用
2
3 var s = "";
4 document.write(s);
5
6 cs后台代码：
7 protected string ShowBehindInfo(string name)
8 {
9 return "姓名：" + name;
10 }
11 方法二：使用
12
13 document.write("");
14
15 cs后台代码：
16 protected void ShowResult()
17 {
18 Response.Write("我是陈全勇气");
19 }
20 方法三：
21
22 .btn
23 {
24 display:none;
25 }
26
27
28 点击调用aspx.cs的代码
29 以下js代码将调用后台的cs代码
30 function invokeCharp()
31 {
32 document.getElementById("Button1").click();
33 }
34 通过js调用的代码
35 protected void Button1_Click(object sender, EventArgs e)
36 {
37 Response.Write("被js调用的代码");
38 }
39 方法四：
40
41
42 //将调用的信息存入隐藏控件中 在提交表单
43 function Button2_onclick()
44 {
45 document.all.txtFunName.value="show";
46 document.forms[0].submit();
47 }
48 //后台cs代码
49 protected void Page_Load(object sender, EventArgs e)
50 {
51 string strFunName = Request.Form["txtFunName"] != null ? Request.Form["txtFunName"] : "";
52 //根据传回来的值决定调用哪个函数
53 switch (strFunName)
54 {
55 case "show":
56 enter(); //调用该函数
57 break;
58 default:
59 //调用默认函数
60 break;
61 }
62 }
63 方法五：
64 使用__doPostBack();
65
66
67
68 function Button6_onclick()
69 {
70 var res = "chenliang";
71 __doPostBack('btn','chenlinng');
72 }
73 //以上脚本将调用以下事件代码
74 protected void btn_Click(object sender, EventArgs e)
75 {
76 string target = Request.Params["__EVENTTARGET"];
77 string args = Request.Params["__EVENTARGUMENT"];
78 Response.Write(target + "" + args);
79 }
80 __doPostBack解释：
81 是一个纯粹并且是非常简单的javascript函数
82 如以上代码，如果ASPX页面有包含asp:LinkButton或者带有AutoPostBack属性且其值为true的服务器控件时
83 ASP.NET会自动为页面生成下面的脚本
84 实际上调用__doPostBack函数
85 也就是将触发回发的控件(第一个参数)及相关参数(第二个参数)付给两个页面的隐藏控件
86 然后提交表单；
87
88
89 function __doPostBack(eventTarget, eventArgument)
90 {
91 if (!theForm.onsubmit || (theForm.onsubmit() != false))
92 {
93 theForm.__EVENTTARGET.value = eventTarget;
94 theForm.__EVENTARGUMENT.value = eventArgument;
95 theForm.submit();
96 }
97 }
98 而在后台事件代码中可以
99 通过Request.Form[“__EVENTTARGET”]获取到触发页面PostBack的事件源（控件的ID）
100 但Button和ImageButton触发的PostBack无法通过这种方式获取到它们的ID
在javascript访问C#函数
2.如何在JavaScript访问C#变量? 方法一：1、通过页面上隐藏域访问 方法二：1、如后台定义了PUBLIC STRING N;前台js中引用该变量的格式为''或"++" 方法三：1、或者你可以在服务器端变量赋值后在页面注册一段脚本 "var temp=" + tmp + "" tmp是后台变量，然后js中可以直接访问temp获得值。
1 1.如何在javascript访问C#变量
2 方法一：使用
3
4 function Button3_onclick()
5 {
6 alert('我的名字：'+ '');
7 }
8 cs代码中的定义：protected string name = "chenlaing";
9 方法二：使用Hidden隐藏控件
10
11 在cs代码中给该隐藏控件赋值： Hidden1.Value = "陈亮";
12 function Button3_onclick()
13 {
14 alert(document.getElementById("Hidden1").value);
15 }
16 方法三：在cs代码中注册js脚本
17 string tmp = "陈全用";
18 ClientScript.RegisterClientScriptBlock(this.GetType(), null, "var temp='" + tmp + "'");
19 function Button3_onclick()
20 {
21 alert(temp);
22 }
View Code
3.如何在C#中访问JavaScript的已有变量? 问题3 .如何在C#中访问JavaScript的已有变量? 方法一：1、前台使用服务器文本控件隐藏域，将js变量值写入其中；后台直接通过控件id访问和调用 （request["id"]） 方法二：可以用cookie或session存储变量值，后台直接使用 4.如何在C#中访问JavaScript函数?问题4 C#代码执行JavaScript函数和调用JavaScript函数 方法一： .尽量少用Response.Write();这种方法,它会影响CSS导致页面效果偏差 方法二：C#中使用ScriptManager.RegisterStartupScript(this, this.GetType(), "edit", "CSharpCallJs('"+param1+"','"+param2+"')",
1 示例：
2
3 脚本函数
4
5 function CSharpCallJs(param1,param2)
6 {
7 alert(param1 + param2);
8 }
9
10 页面后台代码
11
12 ScriptManager.RegisterStartupScript(this, this.GetType(), "edit", "CSharpCallJs('" + param1 + "','" + param2 + "');", true);//关键代码调用页面脚本函数的代码
13
14 方法三：C#中使用 Page.RegisterStartupScript("ggg","CSharpCallJs“(”+param1+“,"+param2+“);"");
15
16 方法四：C#中使用Literal类（类似label类）
17
18 示例代码
19
20 private void Button2_Click(object sender, System.EventArgs e)
21
22 {
23
24 string str;
25
26 str="";
27
28 str+="selectRange()";
29
30 str+="";
31
32 //Literal1.Visible=true;
33
34 Literal1.Text=str;
35
36 ｝
View Code
|
【本文地址】