H5调用系统相册ActionSheet无效个例子 img属性没有type=“file” 所以调用不了相册事件,如果想实现。。。。

必需的属性

alt text 规定图像的替代文本。

src URL 规定显示图像的 URL。

可选的属性

align
  • top
  • bottom
  • middle
  • left
  • right
不推荐使用。规定如何根据周围的文本来排列图像。
border pixels 不推荐使用。定义图像周围的边框。
height
  • pixels
  • %
定义图像的高度。
hspace pixels 不推荐使用。定义图像左侧和右侧的空白。
ismap URL 将图像定义为服务器端图像映射。
longdesc URL 指向包含长的图像描述文档的 URL。
usemap URL 将图像定义为客户器端图像映射。
vspace pixels 不推荐使用。定义图像顶部和底部的空白。
width
  • pixels
  • %
设置图像的宽度。


但如果想点击图片调用相册时width="50" height="50" type="file" accept="image/*" d="imgShow2" />typefile就无效了,因为没有这个属性,所以唤起不了的。

所以那:这样写,如果sheet无效时看是否引入NativeUI.jar 

DOCTYPE html >
< html lang= "zh" >
< head >
< meta charset= "UTF-8" >
< title >Title title >
< img src= "favicon.ico" onclick= "javascript:_onClick()" />
head >
< body >

body >
< script >
function _onClick() {
showActionSheet();
}


//点击事件,弹出选择摄像头和相册的选项
function showActionSheet() {
debugger;
var bts = [{
title: "拍照"
}, {
title: "从相册选择"
}];
plus. nativeUI. actionSheet({
cancel: "取消",
buttons: bts
},
function( e) {
if ( e. index == 1) {
getImage();
} else if ( e. index == 2) {
galleryImgs();
}
}
);
}


//图片显示
function showPics( url, name){
//根据路径读取到文件
plus. io. resolveLocalFileSystemURL(url, function( entry){
entry. file( function( file){
var fileReader = new plus.io.FileReader();
fileReader. readAsDataURL(file);
fileReader. onloadend = function( e) {
var picUrl = e. target. result. toString();
var picIndex = $( "#picIndex"). val();
var nowIndex = parseInt(picIndex)+ 1;
$( "#picIndex"). val(nowIndex);
var html = '';
html += '
'">';
html += '
')">X
'
;
html += '
'" class="upload_img" style="width:100%;height:100%;"/>
'
;
html += '
'
;
html += $( "#image-list"). html();
$( "#image-list"). html(html);
}
});
});
}
//压缩图片
function compressImage( url, filename){
var name= "_doc/upload/"+filename;
plus. zip. compressImage({
src:url, //src: (String 类型 )压缩转换原始图片的路径
dst:name, //压缩转换目标图片的路径
quality: 40, //quality: (Number 类型 )压缩图片的质量.取值范围为1-100
overwrite: true //overwrite: (Boolean 类型 )覆盖生成新文件
},
function( zip) {
//页面显示图片
showPics( zip. target,name);
}, function( error) {
plus. nativeUI. toast( "压缩图片失败,请稍候再试");
});
}

//调用手机摄像头并拍照
function getImage() {
var cmr = plus. camera. getCamera();
cmr. captureImage( function( p) {
plus. io. resolveLocalFileSystemURL(p, function( entry) {
compressImage( entry. toLocalURL(), entry. name);
}, function( e) {
plus. nativeUI. toast( "读取拍照文件错误:" + e. message);
});
}, function( e) {
}, {
filter: 'image'
});
}
//从相册选择照片
function galleryImgs() {
plus. gallery. pick( function( e) {
var name = e. substr( e. lastIndexOf( '/') + 1);
compressImage(e,name);
}, function( e) {
}, {
filter: "image"
});
}

< / script >

html >




你可能感兴趣的:(H5调用系统相册ActionSheet无效个例子 img属性没有type=“file” 所以调用不了相册事件,如果想实现。。。。)