zoukankan      html  css  js  c++  java
  • 【微信公众平台开发】借用微信内置图片浏览功能

    开发微信公众平台时,碰到文章中有非常多图片,须要能够点开图片浏览;那么点击图片直接调用微信client自带的图片播放组件会省非常多事。否则你得去摆弄折腾各种图片浏览插件,比方photoswipe。


    个人封装功能成一个js文件。把该文件放到你须要的网页里面就可以,这样文章当你点击图片时,就会调用图片浏览功能!

    <script>
    		function addLoadEvent(func){ 
    			//将函数作为參数,此函数就是 onload 触发时须要运行的某个函数
    			    var oldonload=window.onload; 
    			    //将原来的 onload 的值赋给暂时变量 oldonload。
    			    if(typeof window.onload!="function"){
    			    //推断 onload 的类型是否是 function。假设已经运行window.onload=function(){...} 赋值,那么此时 onload 的类型就是 function
    			    //否,则说明 onload 还没有被赋值,当前任务 func 为第一个添�的任务
    			        window.onload=func(); 
    			        
    			        //作为第一个任务,给 onload 赋值
    			    }else{ 
    			    //是,则说明 onload 已被赋值,onload 中先前已有任务添�
    			        window.onload=function(){
    			            oldonload();
    			            func(); 
    			            //作为兴许任务,追加到先前的任务后面
    			        }
    			    }
    		}
    		var imgs=new Array();
    		var nowImgurl="";
    		function getPicInfo()
    		{
    			var imgObj=document.getElementsByTagName('img');  //获取图文中全部的img标签对象
    			
    			for(var i=0; i<imgObj.length; i++)
    			{
    				imgs.push(imgObj[i].src); 
    				
    				//以下调用微信内置图片浏览组建
    				imgObj[i].onclick=function(){
    					nowImgurl = this.src;	//获取当前点击图片url
    					WeixinJSBridge.invoke("imagePreview",{
    						"urls":imgs,
    						"current":nowImgurl
    						})
    				}
    			}
    		}
    		
    		addLoadEvent(getPicInfo);	//监听事件
    		
    </script>

  • 相关阅读:
    Object.prototype的原型对象 格式化日期【js笔记】
    数组中去掉重复的 【js笔记】
    按照内容多少,每行自动按照内容较多的div设置其他div的高度【jq笔记】
    动态操作表格 【js笔记】
    关于记录任意选择行删除或者其他的操作【jq笔记】
    Good studying and day day up
    第三周星期一
    第二周星期天
    第二周星期六
    第二周星期五
  • 原文地址:https://www.cnblogs.com/yxwkf/p/3844580.html
Copyright © 2011-2022 走看看