转自:https://blog.csdn.net/qq_36676237/article/details/81533124
首先初始化mui(longtap是我们要用到的,longtap默认为false,如果没有初始化为true,则长按事件无效)
mui.init( { gestureConfig:{
tap: true, //默认为true
doubletap: true, //默认为false
longtap: true, //默认为false
swipe: true, //默认为true
drag: true, //默认为true
hold:true,//默认为false,不监听
release:false//默认为false,不监听
}});
//给需要长按保存图片的img标签设置 class='saveImg'
var divs = document.getElementsByClassName('saveImg');
for(var i = 0;i<divs.length;i++){
divs[i].addEventListener('longtap', function () {
//开启弹框
mui('#picture').popover('toggle');
var imgurl = this.src;
document.getElementById('saveImg').addEventListener('tap', function () {
var imgDtask = plus.downloader.createDownload(imgurl,{method:'GET'}, function (d,status) {
if(status == 200){
plus.gallery.save(d.filename, function () {//保存到相册
plus.io.resolveLocalFileSystemURL(d.filename, function (enpty) {
// 关闭弹框
mui('#picture').popover('toggle');
mui.toast('保存成功')
});
})
}else{
mui.toast('保存失败')
}
});
imgDtask.start();
});
})
}
<-- 弹框的html-->
<div id="picture" class="mui-popover mui-popover-action mui-popover-bottom" style="z-index: 99999999">
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<a href="javascript:;" id="saveImg">保存图片</a>
</li>
</ul>
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<a href="#picture"><b>取消</b></a>
</li>
</ul>
</div>
ps:要引入mui的js和css
另一种方法:
<script type="text/javascript">
mui.init({
gestureConfig: {
longtap: true
}
});
mui.plusReady(function() {
document.addEventListener('longtap', function(e) {
var target = e.target;
savePic(target);
});
});
/**
* 长按保存图片
* 1. 获取图片链接
* 2. 创建下载并下载图片
* 3. 保存至相册
*/
function savePic(target) {
if(target.tagName == 'IMG' && target.currentSrc.length > 0 ) { //确保图片链接不为空
var imgUrl = target.src;
var suffix = cutImageSuffix(imgUrl);
mui.confirm("是否保存此图片", "", ["保存", "取消"], function(event) {
var index = event.index;
if(index == 0) {
var timestamp = (new Date()).valueOf();
var downLoader = plus.downloader.createDownload(imgUrl, {
method: 'GET',
filename: '_downloads/image/' + timestamp+'.png'
}, function(download, status) {
var fileName = download.filename;
/**
* 保存至本地相册
*/
plus.gallery.save(fileName, function() {
mui.toast("保存成功" );
});
});
/**
* 开始下载任务
*/
downLoader.start();
}
});