JS图片更换还原操作,通过图片识别标识
//图片更换还原操作,图片识别标识 如图片img.png 可换成 img2.png
function img_biaoshi(caozuo,img_id, biaoshi) {
var img_src = document.getElementById(img_id).src; //获取id图片路径
var weizhi = img_src.lastIndexOf('.');//查找最后一个出现的位置
var qian=img_src.substring(0,weizhi);//图片前部分
var hou= img_src.substring(weizhi);//图片后部分
if(caozuo=='add') return qian+biaoshi+hou;//添加图片识别标识
if(caozuo=='rm') return qian.substring(0, qian.length - biaoshi.length)+hou;//去掉图片识别标识
else return false;
}
下面调用
//选项卡点击事件
mui('.mui-bar-tab').on('tap', 'a', function(e) {
var targetTab = this.getAttribute('href');
if(targetTab == activeTab) {
return;
}
//更换标题
//title.innerHTML = this.querySelector('.mui-tab-label').innerHTML;
//显示目标选项卡
//若为iOS平台或非首次显示,则直接显示
if(mui.os.ios || aniShow[targetTab]) {
plus.webview.show(targetTab);
} else {
//否则,使用fade-in动画,且保存变量
var temp = {};
temp[targetTab] = "true";
mui.extend(aniShow, temp);
plus.webview.show(targetTab, "pop-in", 200);
} //alert(activeTab+'是上一个,当前'+targetTab);
//console.log(document.getElementById(activeTab).src);
document.getElementById(activeTab).src = img_biaoshi('rm',activeTab, '1'); //上一个
document.getElementById(targetTab).src = img_biaoshi('add',targetTab, '1'); //当前
plus.webview.hide(activeTab); //隐藏当前;
//更改当前活跃的选项卡
activeTab = targetTab;
});
JS图片更换还原操作,通过图片识别标识的更多相关文章
- mui实现图片更换(暂未上传)
页面中有默认的图片,触发type为file的input时,更换图片,这个是mui移动端的项目,算了,不多说,开码 首先,先在html页面中设置样式,样式我就不给了,贴个布局 <div class ...
- Atitit.论图片类型 垃圾文件的识别与清理 流程与设计原则 与api概要设计 v2 pbj
Atitit.论图片类型 垃圾文件的识别与清理 流程与设计原则 与api概要设计 v2 pbj 1. 俩个问题::识别垃圾文件与清理策略1 2. 如何识别垃圾图片1 2.1. 体积过小文件<1 ...
- C#设计模式总结 C#设计模式(22)——访问者模式(Vistor Pattern) C#设计模式总结 .NET Core launch.json 简介 利用Bootstrap Paginator插件和knockout.js完成分页功能 图片在线裁剪和图片上传总结 循序渐进学.Net Core Web Api开发系列【2】:利用Swagger调试WebApi
C#设计模式总结 一. 设计原则 使用设计模式的根本原因是适应变化,提高代码复用率,使软件更具有可维护性和可扩展性.并且,在进行设计的时候,也需要遵循以下几个原则:单一职责原则.开放封闭原则.里氏代替 ...
- js实现点击隐藏图片
方法一: 把图片的display设为none,触发点击事件时,display变为block <style> img { width: 400px;height: 300px; displa ...
- js和jquery如何获取图片真实的宽度和高度
按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度 1.什么时候需要获取图片真实的宽度和高度 在做pc网页 ...
- Sequence.js - 适合电子商务网站的图片滑块
Sequence.js 是一个非常现代的图片滑动效果,特别适合电子商务网站或者企业产品展示功能.带有图片缩率图,能够呈现全屏图片浏览效果.结合 CSS3 Transition 实现响应式的滑块效果. ...
- JS实现等比例缩放图片
JS实现等比例缩放图片 2014-01-19 21:57 by 龙恩0707, 40 阅读, 0 评论, 收藏, 编辑 JS实现等比例缩放图片 有时候我们前端页面只有500×500像素的宽和高的布局, ...
- js手写图片查看器(图片的缩放、旋转、拖拽)
在做一次代码编辑任务中,要查看图片器.在时间允许的条件下,放弃了已经封装好的图片jq插件,现在自己手写js实现图片的缩放.旋转.推拽功能! 具体代码如下: <!DOCTYPE html> ...
- JS实现图片base64转blob对象,压缩图片,预览图片,图片旋转到正确角度
base64转blob对象 /** 将base64转换为文件对象 * @param {String} base64 base64字符串 * */ var convertBase64ToBlob = f ...
随机推荐
- Java基本数据类型的长度范围
1.Java基本数据类型的长度范围代码 /** * @Title:DataTypeLength.java * @Package:com.you.dao * @Description:Java数据类型长 ...
- Netty的并发编程实践5:不要依赖线程优先级
当有多个线程同时运行的时候,由线程调度器来决定哪些线程运行.哪些等待以及线程切换的时间点,由于各个操作系统的线程调度器实现大相径庭,因此,依赖JDK自带的线程优先级来设置线程优先级策略的方法是错误和非 ...
- VxWorks 符号表
符号表初始化 符号表用于建立符号名称.类型和值之间的关系.其中,名称为null结尾的任意字符串:类型为标识各种符号的整数:值为一个字符指针.符号表主要用来作为目标模块加载的基础,但 ...
- hdu5820 Lights
主席树 但是能够想到题解的做法很难 #include <stdio.h> #include <string.h> #include <vector> #includ ...
- ThreadLocal原理
ThreadLocal类可以看作是当前线程的一个局部变量,只有当前线程可以访问,因此是线程安全的. ThreadLocal内部维护了一个ThreadLocalMap类,ThreadLocalMap是一 ...
- Android集成百度地图详细步骤和错误问题
先看要实现的效果 第一步, 下载SDK,基础配置,百度开发文档很详细,直接附上链接http://lbsyun.baidu.com/index.php?title=androidsdk/guide/cr ...
- elfinder源码浏览-Volume文件系统操作类(1)
今天看了一个文件管理的java后台源码,elfinder 发现这个东东比我写的代码效率告到不知道哪去了,苦思冥想后还是抽点时间看看吧.. 它实现了我们电脑上的所以关于文件操作的动作,并生成了api开放 ...
- 13.C++-静态成员变量、静态成员函数
首先回顾下成员变量 能通过对象名能够访问public成员变量 每个对象的成员变量都是专属的 成员变量不能在对象之间共享 再来讲讲类的静态成员变量 介绍 静态成员变量属于整个类所有 静态成员变量的生命期 ...
- 设计模式——模板模式(C++实现)
模板模式:定义一个操作中的算法的骨架,而将一些步骤延迟到子类中.模板方法使得子类可以不改变一个算法的结构即可重定义该算法的某些特定步骤. 模板模式通过把不变的行为搬移到超类,去除子类中的重复代码来 ...
- Linux Centos 下安装软件 三种方式(转)
Linux学习的路还很远呢,各位码农,新年快乐哈! 1)一种是软件的源代码,您需要自己动手编译它.这种软件安装包通常是用gzip压缩过的tar包(后缀为.tar.gz). 2)另一种是软件的可执行程序 ...