html使用JQ调用移动端端相册功能的实现

之前逛论坛看见有人对js原生调取相册功能的解释,自己又用JQ谢了一遍,最主要还是将input属性tepy设置为file,上代码:
html部分:

显示您上传的商品图片

js部分:
别忘了引JQ文件

function readURL(input) {
			if (input.files && input.files[0]) {
				var reader = new FileReader();
				reader.onload = function(e) {
					console.log(e)
					$('#blah').attr('src', e.target.result);
				}
				reader.readAsDataURL(input.files[0]);
			}
		}
		$("#imgInp").change(function() {
			readURL(this);
		});

移动端:
不需要特殊环境,使用input标签 type值为file,可以调用系统默认的照相机、相册、摄像机、录音功能。先上代码:




accept表示打开的系统文件目录
capture表示的是系统所捕获的默认设备,camera:照相机;camcorder:摄像机;microphone:录音;
其中还有一个属性multiple,支持多选,当支持多选时,multiple优先级高于capture,所以只用写成:就可以,可以在手机上测试一下。
记得再加一个判断,让这个input更合理。

你可能感兴趣的:(JQ)