验证码局部刷新，使用UpdatePanel刷新不了，请各位大神指点一下功能为何实现不了，样式请忽略~

Sanlence 2016-08-02 04:25:28
代码量太多，所以我只是贴出一部分前台代码：
Login.aspx:


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Login.aspx.cs" Inherits="Login" %>



<!DOCTYPE html>



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

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <style type="text/css">

        #warning {

            font-family : 微软雅黑,宋体;

            font-size : 12px;

            color : #ff0000;

        }

    </style>

    <script src="jquery-1.11.3/jquery.js"></script>

    <script type="text/javascript">

        function veritySubmitNull() {

            var uname = document.getElementById("user_name").value;

            if (uname == null || uname == "") {

                document.getElementById("warning").textContent = "用户名不能为空！";

                return false;

            }



            var upwd = document.getElementById("user_pwd").value;

            if (upwd == null || upwd == "") {

                document.getElementById("warning").textContent = "密码不能为空！";

                return false;

            }



            var userPattern = /[A-Za-z0-9]{4,20}/;

            var flag = userPattern.test(uname);

            if (flag == false) {

                document.getElementById("warning").textContent = "用户名只能由英文大小写字母组成！";

                return false;

            }



            var pwdPattern = /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,.\/]).{8,18}$/;

            flag = pwdPattern.test(upwd);

            if (flag == false) {

                document.getElementById("warning").textContent = "密码必须由8-16位字母、数字、特殊符号线组成.！";

                return false;

            }



            return true;

        }



        function f_refreshtype() {

            var Image1 = document.getElementByIdx_x_x_x("vcImage");

            if (Image1 != null) {

                Image1.src = Image1.src + "?";

            }

        }



    </script>

</head>

<body>

    

    <form id="form1" runat="server" defaultbutton="Submit" defaultfocus="user_name">

    <div>

        <div class="title">

            

        </div>

        <div class="login">

            用户名：<asp:TextBox ID="user_name" runat="server" Width="174px" Height="20px"></asp:TextBox>

             <br /><br />

            密 码：<asp:TextBox ID="user_pwd" runat="server" TextMode="Password" Width="174px" 

                Height="20px"></asp:TextBox> 

            <br /><br />

            验证码：<asp:TextBox ID="code" runat="server" Width="174px" Height="20px"></asp:TextBox>

            <br /><br />

              

            <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

            <asp:UpdatePanel ID="UpdatePanel1" runat="server">

                <ContentTemplate>

                    <asp:ImageButton ID="vcImage" runat="server" AlternateText="图片验证码" 

                        ImageUrl="~/CreateCode.aspx"  />

                    <asp:Button ID="refreshCode" runat="server" Text="换个验证码" />

                </ContentTemplate>

                <Triggers>

                    <asp:AsyncPostBackTrigger ControlID="refreshCode" />

                </Triggers>

            </asp:UpdatePanel>

            <%--<asp:ImageButton ID="vcImage" runat="server" AlternateText="图片验证码" ImageUrl="~/CreateCode.aspx" 

                 OnClientClick="f_refreshtype()" />--%>

            <br /><br />

                

            <asp:Button ID="Submit" runat="server" Text="登录" OnClick="Submit_Click" 

                OnClientClick="return veritySubmitNull()" Height="25px" Width="54px" 

                 BackColor="#0099ff"/>

             

            <input id="Reset" type="reset" value="重置" style="width: 54px; height: 25px; background-color: #0099ff" />

            <br /><br />

                

            <asp:Label ID="warning" runat="server" Text=""></asp:Label>

            

        </div>

        <div class="footer">



        </div>

    </div>

    </form>

</body>

</html>

关注点：
1、首先，如果注释掉加粗代码，使用斜体的替代，验证码刷新是可以的；
2、其次，如果用上面的代码，刷新不了验证码，按下refresh按钮没有任何变化；

本人asp.net小菜鸟，请教大神们，出现这种情况是为什么呢？需要怎么修改？谢谢！
...全文
417 8 打赏 收藏 转发到动态 举报
写回复
用AI写文章
8 条回复
切换为时间正序
请发表友善的回复…
发表回复
秋的红果实 2016-08-03
  • 打赏
  • 举报
 回复
就在客户端刷新就可以，去掉UpdatePanel， 1、在aspx里，将<asp:Button ID="refreshCode" runat="server" Text="换个验证码" />替换为： 

<a href="javascript:void(0);" onclick="return code();"><span style="color:Black;">换一张</span></a>
2、添加js函数，在<script type="text/javascript">里添加 

function code() 
      { 
        var mycode=document.getElementById("vcImage");
        mycode.src=mycode.src+"?";
        
      }
点击“换一张”，就可以刷新了
秋的红果实 2016-08-03
  • 打赏
  • 举报
 回复
一、用客户端控件和js动作 你用的是ImageButton，这种场合用html控件最好，省的发回到服务器处理，浪费时间 你改成这样： 1、去掉Updatepanel 2、将 <asp:ImageButton ID="vcImage" runat="server" AlternateText="图片验证码" ImageUrl="~/CreateCode.aspx" /> 改成：<img alt="" id="vcImage" src="../CreateCode.aspx" /> 加上 


<a href="javascript:void(0);" onclick="return code();"><span style="color:Black;">换一张</span></a>
3、2、添加js函数，在<script type="text/javascript">里添加 


function code() 
      { 
        var mycode=document.getElementById("vcImage");
        mycode.src=mycode.src+"?";
        
      }
上面代码一定可以执行！ 二、用服务器控件和C# 关于用UpdatePanel 换个验证码 这个按钮要放到UpdatePanel外面，否则不行 

<asp:Button ID="refreshCode" runat="server" OnClick="refreshCode_Click" Text="换个验证码" />
<br />
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:ImageButton ID="vcImage" runat="server" ImageUrl="../CreateCode.aspx" />
    </ContentTemplate>
</asp:UpdatePanel>
另外，在设计界面双击“换个验证码”这个按钮，添加click事件， <asp:Button ID="refreshCode" runat="server" OnClick="refreshCode_Click" Text="换个验证码" /> refreshCode_Click里面什么也不要写，原理是：点击后，回发到服务器，然后服务器重绘页面，那个img就更新了验证码 验证码绝大部分是用客户端控件的
Sanlence 2016-08-03
  • 打赏
  • 举报
 回复
我想出来了在UpdatePanel不能这么使用客户端的javascript代码，只需要把javascript代码换成服务端完成就可以了。谢谢上面各位的回答！
Sanlence 2016-08-03
  • 打赏
  • 举报
 回复
引用 4 楼 秋的红果实的回复:
就在客户端刷新就可以，去掉UpdatePanel， 1、在aspx里，将<asp:Button ID="refreshCode" runat="server" Text="换个验证码" />替换为： 

<a href="javascript:void(0);" onclick="return code();"><span style="color:Black;">换一张</span></a>
2、添加js函数，在<script type="text/javascript">里添加 

function code() 
      { 
        var mycode=document.getElementById("vcImage");
        mycode.src=mycode.src+"?";
        
      }
点击“换一张”，就可以刷新了
另外能看一下我使用UpdatePanel错在哪里吗？
Sanlence 2016-08-03
  • 打赏
  • 举报
 回复
引用 4 楼 From_TaiWan 的回复:
就在客户端刷新就可以，去掉UpdatePanel，
1、在aspx里，将<asp:Button ID="refreshCode" runat="server" Text="换个验证码" />替换为：


<a href="javascript:void(0);" onclick="return code();"><span style="color:Black;">换一张</span></a>


2、添加js函数，在<script type="text/javascript">里添加


function code() 

      { 

        var mycode=document.getElementById("vcImage");

        mycode.src=mycode.src+"?";

        

      }


点击“换一张”，就可以刷新了

不好意思，本来点的是对我有用，点错了点成了“”丢个板砖”。。。
我按照你的方法试了，它会造成另外一个问题，点击换一张之后，验证码不出现了，如下图所示：
Sanlence 2016-08-02
  • 打赏
  • 举报
 回复
引用 1 楼 N_Share_Service的回复:
用AJAX 去请求吧.判断到错误一次!就去请求回来一个新的
因为我这个是提供给特殊的单位用的，验证码总是换来换去别人会特别反感。
Sanlence 2016-08-02
  • 打赏
  • 举报
 回复
引用 1 楼 woainilll 的回复:
用AJAX 去请求吧.判断到错误一次!就去请求回来一个新的
那如果我这种使用方式的话，错在哪里呢？应该怎么修改呢？谢谢！
誰是方長 2016-08-02
  • 打赏
  • 举报
 回复
用AJAX 去请求吧.判断到错误一次!就去请求回来一个新的
UpdatePanel和jQuery不兼容 局部刷新jquery失效
在做项目中发现，在使用了UpdatePanel的地方，局部刷新后，jquery失效了。 后来网上一查，才发现，jquery中的ready事件会在DOM完全加载后运行一次，而当我们实用了UpdatePanel，它只局部更新，并未重新加载页面所有...
前台刷新updatePanel
前台刷新updatePanel,利用JS实现updatepanel的功能，写的很好啊
ASP.NET 第八季 ajax技术
主讲内容： 第一讲 asp.net ajax简介 第二讲 ScriptManager脚本管理控件 第三讲 ScriptManager脚本管理控件 (2) 第四讲 UpdatePanel局部更新控件 第五讲 Timer定时器控件实例
ScriptManager和UpdatePanel控件实现页面异步局部更新效果
ScriptManager和UpdatePanel控件实现页面异步局部更新效果,VS2008项目文件夹，内附详细的文档说明，文档说明包括空间属性和用法介绍及代码说明。个人实验。
使用updatepanel局部刷新实现注册时对用户名的检测示例
主要介绍了使用updatepanel局部刷新实现注册时对用户名的检测示例,需要的朋友可以参考下
.NET社区

62,046

社区成员

669,049

社区内容

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见，支持健康理性的辩论和互动，反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

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

+ 用AI写文章