tengke 发表于 2023-6-14 11:54:51

验证码刷新问题

<form method="post">
    {% csrf_token %}
    <div>
      <label>验证码:</label>
      <input type="text" name="captcha" value="">
      <img id="captcha_img" src="/yzm" alt="captcha">
      <a href="#" id="refresh_captcha">换一张 看不清</a>
    </div>
    <input type="submit" value="登陆">
</form>

————————————————————————————————————————————

对应验证码显示代码
def yzm(request):
    img,code_staing = check_code()
    print(code_staing)

    stream = BytesIO()
    img.save(stream, 'png')
    stream.getvalue()
    returnHttpResponse(stream.getvalue())

求求大佬看一下这个换一个验证码需要怎么操作


isdkz 发表于 2023-6-14 11:54:52

要实现换一个验证码的功能,可以通过以下步骤进行操作:

1. 首先,在HTML代码中,给换一张链接绑定一个点击事件,并设置一个唯一的 id 属性。例如,将 <a> 标签改为如下形式:

<a href="#" id="refresh_captcha">换一张 看不清</a>


2. 接下来,在JavaScript代码中,通过 getElementById 方法获取该链接的DOM对象,并给它绑定一个点击事件处理函数。可以通过使用 addEventListener 来实现事件绑定。具体代码如下:

document.getElementById("refresh_captcha").addEventListener("click", function() {
    var captchaImg = document.getElementById("captcha_img");
    captchaImg.src = "/yzm?" + new Date().getTime();
});


这段代码的作用是在点击换一张链接时,修改验证码图片的 src 属性,加上一个随机的查询参数,以确保每次图片请求都是一个新的链接。这样就会重新加载验证码图片。

以上就是实现换一个验证码的操作方法。

tengke 发表于 2023-6-14 12:12:27

isdkz 发表于 2023-6-14 12:03
要实现换一个验证码的功能,可以通过以下步骤进行操作:

1. 首先,在HTML代码中,给换一张链接绑定一个 ...

,在JavaScript代码中,通过 getElementById

这个是那个文件呢 ??求指点

isdkz 发表于 2023-6-14 12:17:29

tengke 发表于 2023-6-14 12:12
,在JavaScript代码中,通过 getElementById

这个是那个文件呢 ??求指点

这个放在你的模板引入的js文件那里呀,或者放在你的模板的 script 标签里面也行
页: [1]
查看完整版本: 验证码刷新问题