`
yanfaguanli
  • 浏览: 660007 次
文章分类
社区版块
存档分类
最新评论

js实现img src更新请求

 
阅读更多

[javascript]view plaincopy
  1. 1.javascript(更新的函数)
[javascript]view plaincopy
[javascript]view plaincopy
  1. <scripttype="text/javascript">
  2. functionchangeImage(){
  3. varimg=document.getElementById("imgVcode");
  4. if(img.name==1){
  5. img.name=2;
  6. img.src="shop.do?method=registerImage2";
  7. }elseif(img.name==2){
  8. img.name=1;
  9. img.src="shop.do?method=registerImage";
  10. }
  11. }
  12. </script>


2.jsp中img和img改变的代码

[plain]view plaincopy
  1. <td>
  2. <imgclass="yzm_img"id='imgVcode'name="1"src="shop.do?method=registerImage"/>
  3. <inputname="code"type="text"id="txtVerifyCode"
  4. class="yzm_input"onblur="testCode(this)"/>
  5. <divclass="text_leftt1">
  6. <pclass="t1">
  7. <spanid="vcodeValidMsg">请输入图片中的四个字母。</span>
  9. <spanid="codeInfo"style="color:red"></span>
  10. <ahref="#"id="imgchange"onclick="changeImage()">看不清楚？换个图片</a>
  11. </p>
  12. </div>
  13. </td>


3.后台action代码

[java]view plaincopy
  1. publicActionForwardregisterImage(ActionMappingmapping,ActionFormform,
  2. HttpServletRequestrequest,HttpServletResponseresponse)
  3. throwsException{
  4. //将image创建,返回认证码
  5. response.setContentType("image/jpeg");
  6. OutputStreamout=response.getOutputStream();
  7. StringstrEnsure=shopManager.createImageInfo(50,20,out);
  9. //设置到session中
  10. request.getSession().setAttribute("strEnsure",strEnsure);
  11. returnnull;
  12. }
  13. publicActionForwardregisterImage2(ActionMappingmapping,ActionFormform,
  14. HttpServletRequestrequest,HttpServletResponseresponse)
  15. throwsException{
  16. //将image创建,返回认证码
  17. response.setContentType("image/jpeg");
  18. OutputStreamout=response.getOutputStream();
  19. StringstrEnsure=shopManager.createImageInfo(50,20,out);
  21. //设置到session中
  22. request.getSession().setAttribute("strEnsure",strEnsure);
  23. returnnull;
  24. }
[javascript]view plaincopy
  1. 1.javascript(更新的函数)
[javascript]view plaincopy
[javascript]view plaincopy
  1. <scripttype="text/javascript">
  2. functionchangeImage(){
  3. varimg=document.getElementById("imgVcode");
  4. if(img.name==1){
  5. img.name=2;
  6. img.src="shop.do?method=registerImage2";
  7. }elseif(img.name==2){
  8. img.name=1;
  9. img.src="shop.do?method=registerImage";
  10. }
  11. }
  12. </script>


2.jsp中img和img改变的代码

[plain]view plaincopy
  1. <td>
  2. <imgclass="yzm_img"id='imgVcode'name="1"src="shop.do?method=registerImage"/>
  3. <inputname="code"type="text"id="txtVerifyCode"
  4. class="yzm_input"onblur="testCode(this)"/>
  5. <divclass="text_leftt1">
  6. <pclass="t1">
  7. <spanid="vcodeValidMsg">请输入图片中的四个字母。</span>
  9. <spanid="codeInfo"style="color:red"></span>
  10. <ahref="#"id="imgchange"onclick="changeImage()">看不清楚？换个图片</a>
  11. </p>
  12. </div>
  13. </td>


3.后台action代码

[java]view plaincopy
  1. publicActionForwardregisterImage(ActionMappingmapping,ActionFormform,
  2. HttpServletRequestrequest,HttpServletResponseresponse)
  3. throwsException{
  4. //将image创建,返回认证码
  5. response.setContentType("image/jpeg");
  6. OutputStreamout=response.getOutputStream();
  7. StringstrEnsure=shopManager.createImageInfo(50,20,out);
  9. //设置到session中
  10. request.getSession().setAttribute("strEnsure",strEnsure);
  11. returnnull;
  12. }
  13. publicActionForwardregisterImage2(ActionMappingmapping,ActionFormform,
  14. HttpServletRequestrequest,HttpServletResponseresponse)
  15. throwsException{
  16. //将image创建,返回认证码
  17. response.setContentType("image/jpeg");
  18. OutputStreamout=response.getOutputStream();
  19. StringstrEnsure=shopManager.createImageInfo(50,20,out);
  21. //设置到session中
  22. request.getSession().setAttribute("strEnsure",strEnsure);
  23. returnnull;
  24. }
分享到：
| 用JSP＋Servlet实现二进制图像的动态显示 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    JSP结合js实现img中src更新请求的方法

    主要介绍了JSP结合js实现img中src更新请求的方法,以实例形式较为详细的分析了前台页面js控制及后台功能action部分实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下

    图片img的src不变让浏览器重新加载实现方法

    javascript给这个img标签的src属性后面拼接一个 ? 和 javascript对象new Date().getTime()毫秒值做成queryString的样子，就能防止被缓存了在图片... 这样给图片地址拼接一个随机数，用js重新给 img 的 src 赋值，okay

    Vue.js 动态为img的src赋值方法

    需求是这样： ajax获取数据如下 { "code": "200", "data": { "SumAmount": 200, "List": [{ "amount": 100, "sex": "male", "fee": 1, "id": 98, "status": 2, "time": "2015-08-11" ... }

    js实现跨域的几种方法汇总（图片ping、JSONP和CORS）

    图片可以从任何URL中加载，所以将img的src设置成其他域的URL，即可以实现简单的跨域，可以使用onload和onerror事件来确定是否接受到了响应。 var img=new Image(); img.src='//www.jb51.net'; img.onerror=function...

    JavaScript完全自学宝典 源代码

    \testJson\src\jsonExercise\JSONServlet.java 处理页面请求的Servlet。 \testJson\src\jsonExercise\ComdtyBean.java 商品信息的POJO。 \testJson\WebRoot\orderInfo.jsp 录入商品信息的JSP页面。 第21...

    JS图片懒加载的优点及实现原理

    这篇文章主要介绍了JS图片懒加载的优点及实现原理,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 图片懒加载优势： 增强用户体验 优化代码 减少http的请求 ...

    Javascript实现图片懒加载插件的方法

    Web 图片的懒加载就是通过读取img元素，然后获得img元素的data-src（也可以约定为其他属性名）属性的值，并赋予img的src，从而实现动态加载图片的机制。 这里需要注意的是： img在初始化的时候不要设置src属性，因为...

    js 显示base64编码的二进制流网页图片

    base64简单地说，它把一些 8-bit 数据翻译成标准 ASCII 字符，我们把图像文件的内容直接写在了HTML 文件中，这样做的好处是，节省了一个HTTP 请求

    Vue动态加载图片在跨域时无法显示的问题及解决方法

    问题：VUE开发时因为要访问后端的接口所以要配置请求转发，如果直接转发全部请求，那么VUE动态绑定的src也会转发到后端，因为图片在前端，所以会收到404 NOT FOUND的报错。 常规的请求转发 在vue-cli3内，直接编辑...

    javascript将相对路径转绝对路径示例

    这里介绍的其实本质上是两种方法，通过创建DOM或通过JavaScript计算： 1)通过新创建的Image, 经测试会... // 设置相对路径给Image, 此时会发送出请求 url = img.src; // 此时相对路径已经变成绝对路径 img.src =

    jquery-jsonp.js

    　2、不过我们又发现，Web页面上调用js文件时则不受是否跨域的影响（不仅如此，我们还发现凡是拥有”src”这个属性的标签都拥有跨域的能力，比如[removed]、&lt;img&gt;、&lt;iframe&gt;）； 　3、于是可以判断，当前阶段...

    Aloha-Editor：Aloha编辑器是一个JavaScript内容编辑库

    新文件我们目前正在编写新的。... （例如ExtJS，require-js，jquery） / target-构建输出文件夹/ src / src / css-Aloha核心CSS文件/ src / demo-Aloha演示/ src / img-阿罗哈核心图像/ src / lib-需要插件和

    Jquery遮罩ShowLoading组件

    遮罩效果： 二、JQuery遮罩UI实现 &lt;link href="style/showLoading.css" rel="stylesheet" type="text/css" /&gt; &lt;script type="text/javascript" src="js/jquery.showLoading.min.js"&gt;&lt;/script&gt; 三、使用方法 假设...

    采用ajax实现的图片验证码

    2、在jsp页面，编写一个&lt;img src="请求servlet的名称"&gt; 3、编写一个servlet，在servlet中产生图形验证码 ------------------------------------------------------------ //1、给客户端作出的回应是以图片的...

    next-images:在Next.js中导入图像（支持jpg，jpeg，svg，png和gif图像）

    Next.js +图片 在导入图像（默认情况下为jpg，jpeg，png，svg，fig，ico，webp，jp2和avif图像）。 特征 从本地计算机加载图像 从远程（例如CDN）加载图像 将小型图像内联到Base64以减少http请求 在文件名中添加...

    微信小程序 招聘类后台

    小程序后台管理 本项目为小程序招聘类 后台 前端框架使用layui 数据库使用Bmob JavaScript API完成数据请求，网站包括:信息管理 发布招聘 轮播图 用户管理 推荐管理 报名管理 等功能是一个...imgsrc --轮播图修改 index

    jquery插件lazyload.js延迟加载图片的使用方法

    如果一个网页很长并且有很多图片的话，下载图片就需要很多时间，那么就会影响整个网页的加载速度，而这款延迟加载插件，会通过你的滚动情况来加载你需要看的图片，然后它才...script type=”text/javascript” src=”j

    Javascript 跨域知识详细介绍

    如在A网站的img，src指向B网站的某一图片地址，毫无疑问，这在通常情况下都是能正常显示的（且不论防盗链技术）；同样，可以使script标签的src属性指向其它网站的脚本资源（在某些情况下甚至鼓励这样做，以便充分...

    eva.js:Eva.js是专门用于创建交互式游戏项目的前端游戏引擎

    你可以找到Eva.js文档 ，我们通过发送引入请求欣赏你的奉献。 查看。 用法 使用NPM npm i @eva/eva.js @eva/plugin-renderer @eva/plugin-renderer-img --save 在浏览器中 &lt; script src =" ...

Magicbox
Global site tag (gtag.js) - Google Analytics