Input按钮如何在前台与后同时执行？

单线程加锁 2018-09-28 03:55:06

如果是单独执行其中一个方法，都是可以执行的。如果是JS使用onclientclick="settimes(this)" 那么就只行.CS里的方法了，如果是改成onclick="settimes(this)"事件，那就只执行前台的事件了，有没有办法两个都执行呢？

HTML代码：
<input type="button" class="c2" runat="server" id="btnSendCheckNo" onserverclick="SendCheckNo_ServerClick" value="获取验证码" onclientclick="settimes(this)" />

JS代码：在正常情况是出现'点击获取验证码',点击之后作60的倒计时，可以重新点。后台的方法是只要是能点的时候点就会发送验证码。



var countdown = 60;

function settimes(obj) {

    if (countdown == 0) {

        obj.removeAttribute("disabled");

        obj.value = "点击获取验证码";

        countdown = 60;

        return;

    } else {

        obj.setAttribute("disabled", true);

        obj.value = "重新发送(" + countdown + ")";

        countdown--;

    }

    setTimeout(function () {

        settime(obj)

    }, 1000)

}

后台代码：用于发送验证码



 protected void SendCheckNo_ServerClick(object sender, EventArgs e)

        {

            getNewCheckNO();

...全文

929 21 打赏收藏转发到动态举报

写回复

用AI写文章

21 条回复

切换为时间正序

请发表友善的回复…

发表回复

Tiny~ 2018-10-12

打赏
举报

这个问题之前碰到过，解决也很简单，拖一个服务器控件的按钮，绑定2个，1个OnClientClick，这个是给前台页面js判断使用，如果是return ture则执行oclick事件。你用的html按钮绑定还没试过……

Logerlink 2018-09-29

打赏
举报

<input type="button" class="c2" runat="server" id="btnSendCheckNo" onserverclick="SendCheckNo_ServerClick" value="获取验证码" onclick="settimes(this)" />

input
后台点击：onserverclick
前台点击：onclick
asp:Button控件
后台点击：OnClick
前台点击：OnClientClick

逻辑如#12所说的就好，而且好像只能用ajax

Disappear. 2018-09-29

打赏
举报

尼罗小白 2018-09-29

打赏
举报

用Ajax吧

qq_22159471 2018-09-29

打赏
举报

都是大神，少个，都知道膜拜

qq_41948761 2018-09-29

打赏
举报

写的东西很实用。类是咋分的？

落寞伟少 2018-09-28

打赏
举报

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="idnex.aspx.cs" Inherits="test.idnex" %> <!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 id="Head1"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>思政课调查问卷</title> <script language="javascript" type="text/javascript"> if (window != top) top.location.href = location.href; //检查登录的前提条件 function CheckLogin() { var txtStudentCode = document.getElementById("txtStudentCode").value; //用户名 var txtUserPassword = document.getElementById("txtUserPassword").value; //密码 if (txtStudentCode == "") { alert("请输入学号!"); txtStudentCode.focus(); return false; } if (txtUserPassword == "") { alert("请输入密码!"); txtUserPassword.focus(); return false; } return true; } </script> </head> <body style="background-color: #04090d; background-image: url(images/login_bg01.png); background-repeat: no-repeat; background-position: center top; overflow: hidden;"> <%-- 这里要注意，我们的form要添加runat="server" --%> <form runat="server" id="form"> <%--输入用户名框，要添加runat="server"--%> <input id="txtStudentCode" required="" name="username" type="text" runat="server"> <label alt="请输入您的用户名" placeholder="Username"></label> <%--输入密码框，要添加runat="server"--%> <input id="txtUserPassword" required="" name="password" type="password" runat="server"> <label alt="请输入您的密码" placeholder="Password"></label> <%--提交按钮，要添加runat="server" type="submit"--%> <input name="btnLogin" value="" onclick="CheckLogin();" onserverclick="test" id="btnLogin" style="height: 40px; width: 108px; background-image: url('/images/btnlogin.gif');" runat="server" type="submit"> </form> </body> </html> --------------------- using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace test { public partial class idnex : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } //前台点击按钮调用 protected void test(object sender, EventArgs e) { Response.Write("ahogdhgodsngosujlsj"); Page.ClientScript.RegisterStartupScript(Page.GetType(), "message", "<script language='javascript' defer>alert('文件类型不正确，请选择扩展名为.xls的文件！');</script>"); } } }

iiihavedone 2018-09-28

打赏
举报

12楼正解建议楼主把你逻辑改正一下这样才能写的舒服不然到后面就乱了

娃都会打酱油了 2018-09-28

打赏
举报

而且你一旦回发后台后，页面就会刷新，你的js效果也就没了，除非你后台再给前端返回当前离上次发送过去了几秒钟

娃都会打酱油了 2018-09-28

打赏
举报

不过你这逻辑不对，应该是ajax请求，待后台返回发送成功标志后，再执行setinterval

娃都会打酱油了 2018-09-28

打赏
举报

onclientclick="settimes(this)； return true"

土土 2018-09-28

打赏
举报

赞同6楼本来都是全部执行的是不是你加return停止了

以专业开发人员为伍 2018-09-28

打赏
举报

代码少了括号，自己补上。理解这里的内部的机制的概念就好了。

以专业开发人员为伍 2018-09-28

打赏
举报

假设你在 onclick 中写例如

"if(confirm(....) return;"

那么就可能造成服务器端代码不能执行，因为客户端代码有 return，造成拼接在一起的回发服务器刷新代码无法被调用。

sdfgrtyu 2018-09-28

打赏
举报

少个分号你
，，

以专业开发人员为伍 2018-09-28

打赏
举报

至于说 OnServerClient事件，你可以看看 HtmlInputButton 控件的 RenderAttributesInternal 方法的源代码。它调用了 System.Web.UI.Util.WriteOnClickAttribute方法，源代码是这样的

// System.Web.UI.Util
internal static void WriteOnClickAttribute(HtmlTextWriter writer, HtmlControl control, bool submitsAutomatically, bool submitsProgramatically, bool causesValidation, string validationGroup)
{
	AttributeCollection attributes = control.Attributes;
	string text = null;
	if (submitsAutomatically)
	{
		if (causesValidation)
		{
			text = Util.GetClientValidateEvent(validationGroup);
		}
		control.Page.ClientScript.RegisterForEventValidation(control.UniqueID);
	}
	else if (submitsProgramatically)
	{
		if (causesValidation)
		{
			text = Util.GetClientValidatedPostback(control, validationGroup);
		}
		else
		{
			text = control.Page.ClientScript.GetPostBackEventReference(control, string.Empty, true);
		}
	}
	else
	{
		control.Page.ClientScript.RegisterForEventValidation(control.UniqueID);
	}
	if (text != null)
	{
		string text2 = attributes["onclick"];
		if (text2 != null)
		{
			attributes.Remove("onclick");
			writer.WriteAttribute("onclick", text2 + " " + text);
			return;
		}
		writer.WriteAttribute("onclick", text);
	}
}

当校验（Valid）通过之后，它会自动把 control.Page.ClientScript.GetPostBackEventReference 函数输出的回调指令拼接到你写的 onclick 内容的后边。所以按道理来说，本来就是连续执行前后端的代码的。除非是你的前端 onclick 中的描述内容有 return 语句而阻止了 GetPostBackEventReference 产生的代码被调用。

sdfgrtyu 2018-09-28

打赏
举报

<input type="button" class="c2" runat="server" id="btnSendCheckNo" value="获取验证码" onserverclick="SendCheckNo_ServerClick" onclick="settimes(this);" />
亲测有效

单线程加锁 2018-09-28

打赏
举报

引用 3 楼 sp1234 的回复:

你的前半句话无法理解，也不符合 HtmlInputButton 服务器控件的设计。

后半句话，其实你随便写什么自定义属性，例如写
<input type="button" class="c2" runat="server" 喳喳呼呼="pis(sdf>9234)" .......
那么这个自定义的属性也会原封不动地输出到 html 中的。所以你写 onclick 也是如此。

感谢P哥帮助。
我实际就是让前台处理一个倒计时功能，后台发送消息来着。只是程序如果使用 runat="server"就只执行后台的，不加则只执行前台的。

以专业开发人员为伍 2018-09-28

打赏
举报

你的前半句话无法理解，也不符合 HtmlInputButton 服务器控件的设计。后半句话，其实你随便写什么自定义属性，例如写

<input type="button" class="c2" runat="server" 喳喳呼呼="pis(sdf>9234)" .......

那么这个自定义的属性也会原封不动地输出到 html 中的。所以你写 onclick 也是如此。

以专业开发人员为伍 2018-09-28

打赏
举报

HtmlInputButton 服务器控件有 onclientclick 属性/事件吗？你确定？

一、前言前一段的时候，同事有个项目是Asp.net的，自己有一段的时间没有接触了，反过来找个时间研究了一下她的项目，功能其实很简单，就是一个简单的登录页面，前面用到的是html控件，两个input，一个button。功能就是登录，但由于是Asp.net涉及到了前后台的传值，这篇博客就重点介绍一下：Asp.net的前后台如何传值，后台如何接收html的值，以及前台的html的input按钮

CSS分别设置Input样式（按input类型）当你看到这个html标签的时候，你会想到什么？一个文本框？一个按钮？一个单选框？一个复选框？……对，对，对，它们都对。也许你可能想不到，这个小小的input竟然可以创造出10个不同的东西，下面是个列表，看看，哪些是你没有想到的：文本框密码框提交按钮重置按钮单选框复选框普通按钮文件选

寻找的资料一、默认readonly不允许编辑。点击编辑的时候加上边框样式，去掉readonly属性 <style>.readonly input{border:none}</style> <div id="dvInput" class="readonly"> text1：<input type="text" readonly value="text1" /><br /> text2：<input type="text" readon

当你看到这个html标签的时候，你会想到什么？一个文本框？一个按钮？一个单选框？一个复选框？……对，对，对，它们都对。也许你可能想不到，这个小小的input竟然可以创造出10个不同的东西，下面是个列表，看看，哪些是你没有想到的：文本框密码框提交按钮重置按钮单选框复选框普通按钮文件选择控件隐藏框图片按钮所以你可能会说，input真是一个伟大的东西，竟然这么有“搞头”，但是当你真正...

110,534

社区成员

642,576

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

让您成为最强悍的C#开发者

试试用AI创作助手写篇文章吧

+ 用AI写文章