思路与文件上传相同,只是验证码一个方法:

<img  src="{:captcha_src()}"  />

后台文件:app\ceshi\yam

<?php
namespace app\ceshi\controller;
use think\Controller;
use think\Db; class Yzm extends Controller{ public function index()
{
return $this->fetch();
} public function check($code='')
{
$captcha = new \think\captcha\Captcha();
if(!$captcha->check($code)) {
$this->error('验证码错误');
}
else { $this->success('验证码正确'); } } }

前端文件:yzm/index.html

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>图片验证示例</title> </head>
<body>
<h2>图片验证示例</h2>
<div>
<!--验证数据-->
<FORM method="post" class="form" action="{:url('check')}" name='tj'> <p><input name="code" type="text" placeholder="请输入验证码" style="width:100px;">
<span> <!--{:captcha_img()}-->
<img id="verify_img" src="{:captcha_src()}" alt="请点击刷新验证码" onclick="this.src='{:captcha_src()}'+'?'+Math.random()"/> </span>
</p>
<p style="margin-top:30px;"><input name="tj" type="submit" class="button" value="提交"></p>
</FORM>
</div>
</body>
</html>

实现效果:

输入验证码正确:

输入验证码错误:

thinkphp5.0 实现图片验证效果且能点击图片刷新图片的更多相关文章

  1. 完整说明使用SpringBoot+js实现滑动图片验证

    常见的网站验证方式有手机短信验证,图片字符验证,滑块验证,滑块图片验证.本文主要讲解的是滑块图片验证的实现流程.包括后台和前端的实现. 实现效果 使用的API java.awt.image.Buffe ...

  2. jquery图片放大插件鼠标悬停图片放大效果

    都知道jquery都插件是非常强大的,最近分享点jquery插件效果,方便效果开发使用. 一.HTML代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

  3. CSS 实现图片灰度效果 兼容各种浏览器

    CSS 实现图片灰度效果 兼容各种浏览器如360浏览器 CSS实现图片灰度效果就是通过CSS样式让彩色图片呈现为灰色,相当于把一张图像的颜色模式调整为灰度,CSS可以通过以下几种方法来实现灰度效果. ...

  4. CSS 实现图片灰度效果

    非原创-从网上收索出来的文章 CSS实现图片灰度效果就是通过CSS样式让彩色图片呈现为灰色,相当于把一张图像的颜色模式调整为灰度,CSS可以通过以下几种方法来实现灰度效果. 方式1. IE滤镜 img ...

  5. thinkPHP5.0框架验证码调用及点击图片刷新简单实现方法

    这篇文章主要介绍了thinkPHP5.0框架验证码调用及点击图片刷新简单实现方法,结合简单示例形式分析了thinkPHP5框架验证码相关配置.后台验证.前台刷新等操作技巧,学习thinkphp源码的朋 ...

  6. Swift 2.0 封装图片折叠效果

    文/猫爪(简书作者)原文链接:http://www.jianshu.com/p/688c491580e3著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 用Swift封装图片折叠效果 b ...

  7. ThinkPHP5.0图片上传生成缩略图实例代码

    很多朋友遇到这样一个问题,图片上传生成缩略图,很多人在本机(win)测试成功,上传到linux 服务器后错误. 我也遇到同样的问题.网上一查,有无数的人说是服务器临时文件目录权限问题. 几经思考后,发 ...

  8. ThinkPHP5.0框架开发--第10章 TP5.0验证器

    ThinkPHP5.0框架开发--第10章 TP5.0验证器 第10章 TP5.0验证器 ======================================= 今日学习 1.验证器 1) 控 ...

  9. ThinkPHP5.0框架开发--第11章 TP5.0 杂项

    ThinkPHP5.0框架开发--第11章 TP5.0 杂项 第11章 TP5.0 杂项 =============================================== 今日学习 1. ...

随机推荐

  1. Java如何处理已检查异常?

    在Java编程中,如何处理已检查异常? 此示例显示如何使用catch块处理已检查的异常. package com.yiibai; public class HandleCheckedException ...

  2. e796. 设置JSlider的方向

    Besides being either horizontal or vertical, a slider can also be inverted. An inverted horizontal s ...

  3. C# IEnumerator的详解

    迭代器模式是设计模式中行为模式(behavioral pattern)的一个例子,他是一种简化对象间通讯的模式,也是一种非常容易理解和使用的模式.简单来说,迭代器模式使得你能够获取到序列中的所有元素而 ...

  4. webstorm 重置所有设置

    我的是win10的,删除如下路径的文件夹C:\Users\XXX(你自己电脑用户名)\.IntelliJIdeaxxxx(版本号) 这是最快捷的方法

  5. C# webbrowser判断页面是否加载完毕

    private void Form1_Load(object sender, EventArgs e) { webalipay.Url = new Uri("https://authzth. ...

  6. shell 下执行mysql 命令

    From: http://blog.csdn.net/beginning1126/article/details/8590014 方案1 mysql -uuser -ppasswd -e 优点:语句简 ...

  7. CALayer: autoresizingMask

    UIView 可以设定 autoresizingMask,当它的 superView 尺寸改变时,适应何种变化. 不过 CALayer 却没有这个属性,如和做到让 CALayer 和 UIView 一 ...

  8. Android Studio INSTALL_FAILED_UID_CHANGED的解决办法

    使用Android Studio开发Android应用,把Android应用调试安装在手机上时,出现了安装失败的提示:INSTALL_FAILED_UID_CHANGED. 上网找了很多资料: 1.说 ...

  9. ubuntu-14.04.2-desktop-i386.iso:ubuntu-14.04.2-desktop-i386:安装Oracle11gR2

    ubuntu 桌面版的安装不介绍. 如何安装oracle:核心步骤和关键点. ln -sf /bin/bash /bin/sh ln -sf /usr/bin/basename /bin/basena ...

  10. 【转】Redis集群搭建与简单使用

    介绍安装环境与版本 用两台虚拟机模拟6个节点,一台机器3个节点,创建出3 master.3 salve 环境. redis 采用 redis-3.2.4 版本. 两台虚拟机都是 CentOS ,一台 ...