功能说明
1、用户点击指定图片播放图片对应的视频。
2、每一张图片对应不同的视频。
注:布局文件使用数据渲染for循环显示组件,逻辑文件可添加若干个视频数据。
playVideoTap:function(e){//获取被点击了图片IDvar id=e.target.id;for(var i=0;i<ARR_ITEM_DATA.length;i++){if(i==id){//显示视频组件ARR_ITEM_DATA[i].boolPlayVideo=true}else{//隐藏视频组件ARR_ITEM_DATA[i].boolPlayVideo=false}}this.setData({arrItemData:ARR_ITEM_DATA})//播放视频组件this.videoContext.play();},
示例:<view id="view1"></view>
说明:给标签添加事件,包括点击事件(bindtap)、触摸事件(bindtouchstart、bindtouchmove、bindtouchend),此处使用点击事件获取标签ID,事件名:getViewIdTap 示例:
<view id="view1" bindtap="getViewIdTap"></view>在页面逻辑页面中写事件响应函数getViewIdTap:function(e){},e为回调参数,类型为对象 示例:
Page({//获取view标签id事件响应函数getViewIdTap:function(e){//将view标签的id输出到控制台console.log(e.target.id);}}) 自动识别用户上传的身份证图片的正反面信息,并显示到小程序页上
$_FILES['image']获取用户上传的文件格式 示例:
$_FILES['image']['type']
判断用户上传的文件格式是否为图片格式(JPG、JPEG、PJEPG……),图片格式判断根据实际情况设定 判断用户上传的图片是否已存在 不存在则将调用move_uploaded_file( string $filename , string $destination)函数将上传的文件保存到指定位置 示例:move_uploaded_file($image_tmp_name,"uploads/".$strRondom.$image_name); 调用Face++图片识别API,并输出返回的数据
用户通过左滑动作清空输入框数据
原理说明: 1、输入框(input)设置 数据绑定input的value属性值 示例:
<input value="{{inputValue}}"/>定义input的触摸事件:bindtouchstart(触摸动作开始时触发)、bindtouchmove(触摸后移动时触发)、bindtouchend(触摸动作结束后触发) 示例:
<input bindtouchstart="inputTouchStart" bindtouchmove="inputTouchMove" bindtouchend="inputTouchEnd"/>2、事件逻辑 bindtouchstart:获取用户开始触摸屏幕时的X坐标(e.touches[0].clientX) 示例:
inputTouchStart:function(e){OBJ_INPUT_TOUCH.start.x=e.touches[0].clientX;}bindtouchmove:获取用户触摸屏幕移动时的X坐标(e.touches[0].clientX) 示例:
inputTouchMove:function(e){OBJ_INPUT_TOUCH.move.x=e.touches[0].clientX;},bindtouchend:判断用户是否有移动,若有移动则判断用户滑动的方向 3、如何判断用户滑动的方向? 逻辑1: 若移动后的X坐标小于开始触摸时的X坐标,则为向左滑动;否则,反之。 示例:
if(OBJ_INPUT_TOUCH.move.x<OBJ_INPUT_TOUCH.start.x){console.log('用户向左移动')}逻辑2: 用移动后的X坐标减开始触摸时的X坐标,若结果小于0,则为向左滑动;否则,反之。 示例:
if((OBJ_INPUT_TOUCH.move.x-OBJ_INPUT_TOUCH.start.x)<0){console.log('用户向左移动')}