js调用.net后台事件、后台调用前台以及js调用服务器控件
1. javaScript函数中执行C#代码中的函数:
方法一:间接触发后台代码
1、首先建立一个服务端控件按钮命名为btn1,双击进入后台将调用或处理的内容写入btn1_click中;
2、在前台写一个js函数,内容为document.getElementByIdx("btn1").click();
3、在前台调用js函数,激发click事件,等于访问后台c#函数;
代码如下:
<input id="hBt" type="button" value="CLICK ME2" onclick="fun2()" />
<asp:Button ID="aBt" runat="server" Text="server BT" OnClick="aBt_Click" />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
protected void aBt_Click(object sender, EventArgs e)
{ Label1.Text = " 嗦嘎~~~"; }
js代码如下:
function fun2() {
document.getElementById('aBt').click();
}
方法二:1、函数声明为public
后台代码(把public改成protected也可以)
public string ss()
{
return("a");
}//
2、在html里用 <%=fucntion()%>可以调用
前台脚本
<script language=javascript>
var a = " <%=ss()%>";
alert(a);
</script>
有参数的形式
如图所示 都是html控件 输入姓名 点击按钮获取您输入的信息!
代码如下: <div> Your Name is:<input id="name" type="text" />
<input id="clickBt" type="button" value="GET NAME" onclick="fun()" /> <input id="nameTxt" type="text" /> </div> js如下: <script language="javascript" type="text/javascript"> function fun() { var name = document.getElementById('name').value; var nameStr = '<%=getName("'+name+'") %>';页面在第一次加载的时候,由于页面的执行顺序,运行到这里的时候回以 ' + name + '的值传到后台,但不真正的执行后台方法 document.getElementById('nameTxt').value = nameStr; } </script>
后台代码如下: public string getName(string namePar) { return namePar + " is your name"; } 方法三: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 type="button" value="按钮" >
方法四: <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 type="text">
<input type="hidden" > 〈!--用来存储你要调用的函数 --〉
在.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 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的已有变量?
答案如下:
方法一:1、前台使用静态文本控件隐藏域,将js变量值写入其中;
2、后台用request["id"]来获取值;
方法二:可以用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;
}
客户端如何获取ASP.net服务器控件ID
<asp:TextBox ID="TextBox_Uid" runat="server" MaxLength="20" ></asp:TextBox>
<asp:TextBox ID="TextBox_Pwd1" runat="server" MaxLength="20" TextMode="Password"></asp:TextBox>
<asp:Button ID="Button_Login" runat="server" Text="登录" OnClick="Button_Login_Click" OnClientClick="return CheckReg()" />
如何准确获取服务器控件的ID?请看下面:使用<%=控件ID.ClientID%>
为了减少输入的频繁提交。我在客户端写入一个Javascript方法,简单判断输入的值是否符合要求。如果账号和密码输入不为空,我就提交到后台进行判断。 控件TextBox的ID为TextBox_Uid和TextBox_Pwd1但是在客户端竟然变成了ctl00_TextBox_User和ctl00_TextBox_Pwd。
<script language="javascript" type="text/javascript">
//检查账号、密码是否为空
function CheckReg()
{
var uid = document.getElementById("<%=TextBox_Uid.ClientID %>").value;
var pwd1 = document.getElementById("<%=TextBox_Pwd1.ClientID %>").value;
if(uid == "" || pwd1 == "")
{
alert("账号和密码不能为空!");
return false;
}
return true;
}
</script>
js调用.net后台事件、后台调用前台以及js调用服务器控件的更多相关文章
- 前台的js对象数组传到后台处理。在前台把js对象数组转化为json字符串,在后台把json字符串解析为List<>
前台的js对象数组传到后台处理.在前台把js对象数组转化为json字符串,在后台把json字符串解析为List<>
- 在后台 .cs 中执行前台的js 函数
<script type="text/javascript" language="javascript"> <!-- function ope ...
- JS与JQ绑定事件的几种方式.
JS与JQ绑定事件的几种方式 JS绑定事件的三种方式 直接在DOM中进行绑定 <button onclick="alert('success')" type="bu ...
- js调用.net后台事件,和后台调用前台等方法总结(转帖)
js调用.net后台事件,和后台调用前台等方法总结 原文来自:http://hi.baidu.com/xiaowei0705/blog/item/4d56163f5e4bf616bba16725.ht ...
- asp.net 调用前台JS调用后台,后台掉前台JS
C#前台js调用后台代码前台js<script type="text/javascript" language="javascript"> func ...
- .NET 前台调用后台事件和方法实现小结
转自:https://www.cnblogs.com/kinger906/p/3431842.html 除了下文讲的方式外,还有一种方式:html里面使用ajax写好提交方式和提交参数,然后以写一行带 ...
- js 调用后台,后台调用js
<html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat=" ...
- 由ASP.NET所谓前台调用后台、后台调用前台想到HTTP——实践篇(二)
在由ASP.NET所谓前台调用后台.后台调用前台想到HTTP——理论篇中描述了一下ASP.NET新手的三个问题及相关的HTTP协议内容,在由ASP.NET所谓前台调用后台.后台调用前台想到HTTP—— ...
- 由ASP.NET所谓前台调用后台、后台调用前台想到HTTP
由ASP.NET所谓前台调用后台.后台调用前台想到HTTP 在由ASP.NET所谓前台调用后台.后台调用前台想到HTTP——理论篇中描述了一下ASP.NET新手的三个问题及相关的HTTP协议内容,在由 ...
- ASP.NET所谓前台调用后台、后台调用前台想到HTTP——实践篇
由ASP.NET所谓前台调用后台.后台调用前台想到HTTP——实践篇 在由ASP.NET所谓前台调用后台.后台调用前台想到HTTP——理论篇中描述了一下ASP.NET新手的三个问题及相关的HTTP协议 ...
随机推荐
- AngularJS使用指南
ng-app 定义一个AngularJS应用程序 ng-model 把元素值绑定到AngularJS应用程序 ng-blind 把AngularJS应用程序数据绑定到HTML视图上 ng-init 初 ...
- centos6安装python3.4和pip3
在安装了epel源的情况下,直接yum就可以安装python3.4 yum install python34 -ypython3 --version 没有自带pip3,从官网安装 wget --no- ...
- wordcount 过程
hdfs原始数据 hello a hello b map阶段: 输入数据:<0,"hello a"> <8,"hello b"> key ...
- drawable animation
drawable 动画,帧动画: 1 定义动画xml文件 <?xml version="1.0" encoding="utf-8"?> <an ...
- 记SpannableString设多少span时注意事项
public void setSpan(Object what, int start, int end, int flags) { } 这个方法里的第一个参数,也就是一些span的对象,不能重复使用. ...
- 微信小程序-发起请求
wx.request(object) wx.request发起的是https请求.一个微信小程序,同时只能有5个网络请求连接. object参数说明: 示例代码: wx.request({ url: ...
- ichart.js绘制虚线 ,平均分虚线
var Data=new Array(); Data[0] = { labels : ["第一单元","第二单元","第三单元"," ...
- PNG的使用技巧
Png是图像文件存储格式,在网页设计中已经不是一个陌生的名词,在前端开发中经常使用到它,如常用CSS 雪碧图.而Png的使用不仅仅如此,Png有多少种格式,有哪些特点,PC端中常用的Png格式是哪些, ...
- 启动受管服务器出现:unable to get file lock, will retry...
启动受管服务器出现:unable to get file lock, will retry... 解决方法:一.删掉Domain下的*.lok文件1. 删除edit.lok进入到domain_home ...
- vscode 与 python 的约会
安装python 官网(https://www.python.org/downloads/)下载, 安装. (简单略过). 运行python代码 运行python代码的常见方式有三种: 运行pytho ...