很惋惜，這個鬼東西微信內置瀏覽器不適用javascript
頁面：css
<!doctype html> <html> <head> <meta charset="UTF-8"> <meta content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport"> <title>節日賀卡</title> <link rel="stylesheet" href="../css/common.css" type="text/css" media="screen"/> <link rel="stylesheet" href="../css/main.css" type="text/css" media="screen"/> <script src="../js/init.js"></script> <script src="../js/jquery-3.2.1.min.js"></script> <script src="../js/base.js"></script> <script src="../js/wxshare.js" ></script> <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script> <link rel="icon" type="image/png" href="../img/icon.png"> </head> <body class="bodybgfff"> <!-- 頭部start --> <header class="trx_header clearfix"> <h1>節日賀卡</h1> <div class="fl trx_return"><a href="../page/personalCenter.html"></a></div> </header> <!-- 頭部搜索end --> <!-- 海報start --> <input type="hidden" id="posterType" value="02"/> <div class="my_haibao"> <ul class="haibao-list" id="my_poster_id"> </ul> </div> <img style="display:none" class="qdb_nocotent no_search_data" src="../img/search_no.png" alt="" > <p style="display:none" class="search_not_text no_search_data">暫時木有海報哦</p> <!-- 海報end --> <!-- 彈出層end --> <div class="mark" ></div> <div class="haibao-show"> <span class="btn-close-haibao"></span> <img src="img/app-down-bg.jpg" alt="" id="picurl"/> <p id="successHint" style="display:none">圖片已保存到相冊，可分享給好友</p> <p id="failHint" style="display:none">圖片保存失敗</p> <a href="#" onclick="javascript:savePic();">保存到相冊</a> </div> <!-- 分享二維碼end --> <script src="../js/model/myPosterList.js"></script> </body> </html>
js:html
/** * Created by wwj on 2019/03/11. */ $(document).ready(function(){ pageShow = 9; nowPage = 1; loadDataId="my_poster_id"; /*var url = window.basePath + "/h5/front/poster/toPoster"; $.ajax({ url: url, type: 'GET', dataType: 'json', data: {}, success: function (rest) { $("#salesmanUuid").val(rest.data.salesmanUuid); } })*/ pageCallBack() }); function pageCallBack(){ loadPosterContent(); } function loadPosterContent(){ var storeNo = getSessionStoreNo(); var posterType = $("#posterType").val(); var url = window.basePath + "/h5/front/poster/ajaxSearchPoster"; $.ajax({ url: url, type: 'POST', dataType: 'json', data: {currentPage: nowPage,pageShow:pageShow,storeNo:storeNo,posterType:posterType}, success: function (rest) { console.log(rest) if(rest.result){ appendPosterResult(rest); }else{ $(".no_search_data").show(); } console.log('start') } }) } //拼接加載出來的產品 function appendPosterResult(data){ var results = data.results; if(results!=null&&results.length>0){ var appendHtml = ""; for(var i=0;i<results.length;i++){ var poster = results[i]; //appendHtml += '<li><a href="javascript:void(0);" onclick="toPosterPage(\''+poster.uuid+'\',\''+poster.posterTitle+'\')"><img src="'+poster.posterImgUrl+'" alt=""/><p>'+poster.posterTitle+'</p></a></li>'; appendHtml +='<li>' +'<a href="#"><img src="'+poster.posterImgUrl+'" alt=""/><p>'+poster.posterTitle+'</p></a>' +'</li>'; } $("#my_poster_id").append(appendHtml); $(".no_search_data").hide(); }else{ if(nowPage==1){ totalPage = data.totalPage; $(".no_search_data").show(); } } nowPage++; initPreviewJs(); } //初始化圖片預覽效果js function initPreviewJs(){ $(".haibao-list li img").click(function(){ var imgSrc = $(this)[0].src; $(".mark").fadeIn(); $(".haibao-show").fadeIn().children("img").attr("src",imgSrc); }) $(".btn-close-haibao,.mark").click(function(){ $(".mark").fadeOut(); $(".haibao-show").fadeOut(); $("#successHint").hide(); $("#failHint").hide(); }) } //保存到相冊 function savePic(){ var picurl= $("#picurl").attr("src"); //alert(picurl); savePicture(picurl); } var triggerEvent = "touchstart"; function savePicture(Url){ var blob=new Blob([''], {type:'application/octet-stream'}); var url = URL.createObjectURL(blob); var a = document.createElement('a'); a.href = Url; a.download = Url.replace(/(.*\/)*([^.]+.*)/ig,"$2").split("?")[0]; var e = document.createEvent('MouseEvents'); e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); a.dispatchEvent(e); URL.revokeObjectURL(url); }
參考博客：https://blog.csdn.net/rentian1/article/details/84988590java