JavaScript与后台方法互调

最新推荐文章于 2024-07-26 20:46:33 发布

ouailuo143

最新推荐文章于 2024-07-26 20:46:33 发布

阅读量838

点赞数

分类专栏： JS DotNet 文章标签： javascript button function string c# server

DotNet 同时被 2 个专栏收录

64 篇文章 0 订阅

订阅专栏

10 篇文章 0 订阅

订阅专栏

1、C#实现前台与后台方法互调实例代码

前台代码

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JavaScript get Net Function.aspx.cs" Inherits="JavaScript_get_Net_Function" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>前台与后台方法护调总结</title> 
    <%--  
        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;  
    --%> 
     
    <%--  
        ASP.Net后台调用JavaScript function的方法,我们要注意:  
            1.尽量少用Response.Write(< script>< /script>);这种方法,它会影响CSS导致页面效果偏差  
            2.C#中使用ScriptManager.RegisterStartupScript(this, this.GetType(), "edit", "JS('"+param1+"','"+param2+"')", true);  
            3.添加 using System.Web.UI;  
    --%> 
    
    <script type="text/javascript"> 
    
/*-------------JavaScript调用.Net后台Start----------------------------------*/  
        function JsCallCSharp(param1)  
        {  
            PageMethods.SayHelloFromPage(param1,onSayHelloSucceeded);  
        }  
         
        function onSayHelloSucceeded(result)  
        {  
            alert(result);  
        }  
/*-------------JavaScript调用.Net后台End----------------------------------*/  
         
/*-------------.Net调用JavaScript Start-----------------------------------*/  
        function CSharpCallJs(param1,param2)  
        {  
            alert(param1 + param2);  
        }  
/*-------------.Net调用JavaScript Start-----------------------------------*/  
    </script> 
     
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
        <asp:ScriptManager ID="ScriptManager1" EnablePageMethods="true" runat="server" /> 
    </div> 
     
    <asp:Button ID="Button1" οnclick="Button1_Click" OnClientClick="JsCallCSharp('takako');" runat="server" Text="Button1" /> 
     
    </form> 
</body> 
</html>

后台代码

using System;  
using System.Web.Services;  
using System.Web.UI;  
 
public partial class JavaScript_get_Net_Function : System.Web.UI.Page  
{  
    protected void Page_Load(object sender, EventArgs e)  
    {  
 
    }  
 
    protected void Button1_Click(object sender, EventArgs e)  
    {  
        string param1 = "你好:";  
        string param2 = "takako_mu";  
        ScriptManager.RegisterStartupScript(this, this.GetType(), "edit", "CSharpCallJs('" + param1 + "','" + param2 + "');", true);  
    }  
 
    [WebMethod]  
    public static string SayHelloFromPage(string name)  
    {  
        return string.Format("Hello {0}!", name);  
    }  
}

2、JS与CS互访

转自http://hi.baidu.com/wangningke123/blog/item/317f014f0877d0eed62afc7e.html

.如何在JavaScript访问C#函数?
2.如何在JavaScript访问C#变量?
3.如何在C#中访问JavaScript的已有变量?
4.如何在C#中访问JavaScript函数?

问题1答案如下：
javaScript函数中执行C#代码中的函数：
方法一：1、首先建立一个按钮，在后台将调用或处理的内容写入button_click中;
2、在前台写一个js函数，内容为document.getElementById("btn1").click();
3、在前台或后台调用js函数，激发click事件，等于访问后台c#函数；

(若想让Button1在页面上不显示，则嵌套一个div 显示设置成不显示，不能使用visable=false，因为用visable=false时，getElementById可能找不到Button1)

<a id="div1" href="#" οnclick="Bind()">无刷新更改隐藏的button触发</a>
        <div style="display:none">
        <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click"/>
        </div>

方法二：1、函数声明为public
后台代码(把public改成protected也可以)
public string ss()
{
return("a");
}
2、在html里用 <%=fucntion()% >可以调用
前台脚本
<script language=javascript >
var a = " <%=ss()% >";
alert(a);
</script >
方法三：1、 <script language="javascript" >
<!--
function __doPostBack(eventTarget, eventArgument)
{
var theForm = document.Form1; //指runat=server的form
theForm.__EVENTTARGET.value = eventTarget;
theFrom.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
-- >
</script >
<input id="Button1" type="button" name="Button1" value="按钮" οnclick="javascript:__doPostBack( 'Button1 ', ' ')" >

方法四： <script language="javascript" >
function SubmitKeyClick()
{
if (event.keyCode == 13)
{
event.cancelBubble = true;
event.returnValue = false;
document.all.FunName.value="你要调用的函数名"；
document.form[0].submit();
}
}
</script >

<INPUT οnkeypress="SubmitKeyClick()" id="aaa" type="text" >
<input type="hidden" name="FunName" > 〈！--用来存储你要调用的函数 --〉

在.CS里有：
public Page_OnLoad()
{
if (!Page.IsPost())
{
string strFunName=Request.Form["FunName"]!=null?Request.Form["FunName"]:"";
//根据传回来的值决定调用哪个函数
switch(strFunName)
{
case "enter()":
enter() ; //调用该函数
break;
case "其他":
//调用其他函数
break;
default:
//调用默认函数
break;
}
}
}

public void enter()
{
//……比如计算某值
}

问题2.如何在JavaScript访问C#变量?
答案如下：
方法一：1、通过页面上隐藏域访问 <input id="xx" type="hidden" runat="server" >
方法二：1、如后台定义了PUBLIC STRING N;前台js中引用该变量的格式为 ' <%=n% > '或"+ <%=n% >+"
方法三：1、或者你可以在服务器端变量赋值后在页面注册一段脚本
" <script language= 'javascript ' >var temp=" + tmp + " </script >"
tmp是后台变量，然后js中可以直接访问temp获得值。

3.如何在C#中访问JavaScript的已有变量?

答案如下：

方法一：推荐使用控件
在JS中添加代码
document.getElementById("HiddenField1").value = '风中追风';
在后台代码中,可以直接使用HiddenField1.Value取得

使用
在后台代码中,可以直接使用leslie.Value取得

方法二：可以用cookie或session

4.如何在C#中访问JavaScript函数?
答案如下：
c#代码中执行javaScript函数：
方法一：1、Page.RegisterStartupScript("ggg"," <script >SetVisible(1); </script >");
方法二：使用Literal类，然后
private void Button2_Click(object sender, System.EventArgs e)
{
string str;
str=" <script language= 'javascript ' >";
str+="selectRange()";
str+=" </script >";
//Literal1.Visible=true;
Literal1.Text=str;
}

3、使用AJAX直接调用后台方法

前台代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="AJAX1._Default" %>   

    

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   

    

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

 <head runat="server">   

     <title>Untitled Page</title>   

     <script type="text/javascript">   

         function btnClick(){   

             // 调用页面后台方法，前面跟方法所需的参数，接着是方法回调成功时要执行的js函数，最后一个是方法回调失败时要执行的js函数   

             PageMethods.Hello("you",funReady,funError);   

         }           

         // result 就是后台方法返回的数据   

         function funReady(result){   

             alert(result);   

         }   

         // err 就是后台方法返回的错误信息   

         function funError(err){   

             alert("Error:" + err._message );   

         }   
     </script>   

 </head>   

 <body>   

     <form id="form1" runat="server">   

     <div>   

         下面要加上EnablePageMethods="true"属性，才能使用后台方法           
         <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">   

         </asp:ScriptManager>   

         <input type="button" οnclick="btnClick();" value="test" />   

     </div>   

    </form>   

 </body>   

</html>

后台代码：

namespace AJAX1   

 {   

     public partial class _Default : System.Web.UI.Page   

     {   

         // 需要标识为WebMethod    

         [System.Web.Services.WebMethod]   

         // 注意，要让前台调用的方法，一定要是public和static的    

         public static string Hello(string name)   

         {   

             return "Hello:" + name;   

         }   

     }   

 }