js和cs的值相互传递和函数的相互调用

Sun_xiangyan

于 2019-11-06 19:02:06 发布

阅读量2k

点赞数 3

分类专栏： C# webGIS

原文链接：https://blog.csdn.net/weixin_41929029/article/details/95645785

版权

C# 同时被 2 个专栏收录

32 篇文章 0 订阅

订阅专栏

webGIS

5 篇文章 0 订阅

订阅专栏

转载于：Js与cs的值相互传递和函数的相互调用

cs传值给js

aspx代码：

 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="JsCallCsValue.aspx.cs" Inherits="JsCallCsValue" %>
  
  <!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>
  
       <script language="javascript" type="text/javascript">
 <!--
     //宣告一个变量，方便调用
     var jsVariable ;
     //在Javascript使用WebControl Literal 可以调用aspx.cs需要的值。
     <asp:Literal id="Literal1" runat="server" />    
     //下面是调用变量。当然你的处理代码不是简单的如下只抛出信息而已。
      alert(jsVariable);
 
 // -->
     </script>
 </head>
 <body>
     <form id="form1" runat="server">
     <div>
     
     </div>
     </form>
 </body>
 </html>

cs后台代码：

using System;
  using System.Collections.Generic;
  using System.Linq;
 using System.Web;
  using System.Web.UI;
  using System.Web.UI.WebControls;
  
  public partial class JsCallCsValue : System.Web.UI.Page
  {
     protected void Page_Load(object sender, EventArgs e)
     {
        //宣告一个cs变量
         string csVariable = "Hello Insus.NET!";
         //为Web控件赋值，值中有一个js的变量jsVariable,即是aspx页面12行的变量。
         this.Literal1.Text = "jsVariable=\"" + csVariable + "\";";
     }
 }

这里通过<asp:Literal id=“Literal1” runat=“server” /> 控件实现将cs后台中的csVariable变量传递到前端js中的jsVariable 中。这是相对于其他方法简单快捷的方式。

js传值给cs后台

常见的是通过Ajax将js中的值传递到cs，也可以用另一种方式，就是通过调用函数时传参的方式传到后台。ps:代码在后面的函数调用

js调用后台cs函数

无参数调用

aspx代码：

<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title>无标题页</title>  
    <mce:script type="text/javascript" ><!--  
     var demo=function(){  
       var b= "<%=test() %>";  
       alert(b);  
       }  
// --></mce:script>   
</head>  
<body>  
    <form id="form1" runat="server">  
    <div>  
        <input type="button" id="id1" onclick="demo()" value="JS调用CS" />  
    </div>  
    </form>  
</body>  
</html>

cs后台代码：

public string test()  
 {  
    return "Hello World";  
 }

这里调用通过 "<%=test() %>"的方式调用cs中的 test()函数。这里是无参数调用。

有参数调用

aspx代码：

<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title>无标题页</title>  
    <mce:script type="text/javascript" ><!--  
     var demo=function(){  
       var a="Hello World";  
       var b= '<%=test("'+a+'") %>';//这里一定注意单引号和双引号的使用!!!!!   
       alert(b);  
       }  
// --></mce:script>   
</head>  
<body>  
    <form id="form1" runat="server">  
    <div>  
        <input type="button" id="id1" onclick="demo()" value="JS调用CS" />  
    </div>  
    </form>  
</body>  
</html>

cs后台代码：

public string test(string a)  
 {  
    return a;  
 }

这里通过 ‘<%=test("’+a+’") %>‘调用函数test(string a) ，但是你测试时会发现根本没有将变量a传递了，只是传递了定值’+a+’，这是一个坑。所以通过此方法只能是调用无参数的函数。

接下来用另一种既可以传无参数函数也可以传有参数函数。
PageMethods
aspx代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_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>无标题页</title>
<script type="text/javascript" language="javascript">
<!--
function minbzdm()
{
PageMethods.OK(xxx);
}
function xxx(result)
{
alert(result);
}
//-->
</script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
    </asp:ScriptManager>
    <div>
    <input type='button' value='删除' onclick='minbzdm()' />
    </div>
    </form>
</body>
</html>

CS代码：


public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }

    [System.Web.Services.WebMethod]
    public static string OK() 
    {
        return "OK";
    }
}

这是通过PageMethods实现js调用cs后台函数的方法。有参数和无参数都可以。并且可以传值给后台。
通过PageMethods方法来实现JS调用CS，必须注意一下几点：

【1】静态的方法

     public static

【2】需要在cs方法上加上：

     [System.Web.Services.WebMethod]

【3】需要自定义一个函数接受结果

    function xxx(result)
    {
    alert(result);
    }

【4】ScriptManager 必须设置成 EnablePageMethods=“true”

cs调用js函数的方法

cs后台代码：

 protected void OnEditing(object sender, GridViewEditEventArgs e)
    {
        int id = Int32.Parse(GridView1.Rows[e.NewEditIndex].Cells[1].Text);///得到你要编辑文章的id
                                                                       
        String Url = "AddArticle.aspx?ID=" + id.ToString();AddArticle.aspx是你要找到编辑的页面
        ScriptManager.RegisterStartupScript(UpdatePanel1, this.GetType(), "redirectMe", "confirm_1('"+code+"');", true);
   }

aspx中js函数代码:

function confirm_1(code) {
             alertify.confirm("是否和微信号绑定？以后方便联系您!", function (e) {
                 if (e) {
                     PageMethods.WXconnect(code, openid);
                     alertify.success("绑定成功");
                     return true;
                 } else {
                     PageMethods.WXdisconnect(code);
                     alertify.error("绑定失败");
                     return false;
                 }
             });
         };

另一种cs调用js的方法是直接在后台cs中写js

string script = "if ( window.confirm('找回密码成功"+role.Rolename+"，点击确认跳转到登录页面')) {  window.location.href='login.aspx' } ;";
 ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "key", script, true);

这种方法不仅可以调用js而且可以引用cs中的变量，不用cs后台向前端传值。

Sun_xiangyan

关注

3
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
js和cs的值相互传递和函数的相互调用

转载于：Js与cs的值相互传递和函数的相互调用cs传值给jsaspx代码： <%@ Page Language="C#" AutoEventWireup="true" CodeFile="JsCallCsValue.aspx.cs" Inherits="JsCallCsValue" %> <!DOCTYPE html PUBLIC "-//W3C//...
复制链接

扫一扫