h5调用手机摄像头/相册

<!DOCTYPE HTML><html><head>   <title>上传图片</title>   <meta charset="utf-8"></head><body><iframe name="uploadfrm" id="uploadfrm" style="display: none;"></iframe><form name="formHead" method="post" action="" id="formHead" enctype="multipart/form-data" target="uploadfrm">

<div>      <div>         <input type="file" name="file_head" id="file_head" onchange="javascript:setImagePreview();" />      </div>      <div>         <div id="DivUp" style="display: none">            <input type="submit" data-inline="true" id="BtnUp" value="确认上传" data-mini="true" />         </div>      </div>   </div></form><div data-role="fieldcontain">   <div id="localImag">      <img id="preview" width="-1" height="-1" style="display: none" />   </div></div>

<script type="text/javascript">    function setImagePreview() {        var preview, img_txt, localImag, file_head = document.getElementById("file_head"),            picture = file_head.value;        if (!picture.match(/.jpg|.gif|.png|.bmp/i)) return alert("您上传的图片格式不正确，请重新选择！"),            !1;        if (preview = document.getElementById("preview"), file_head.files && file_head.files[0]) preview.style.display = "block",            preview.style.width = "63px",            preview.style.height = "63px",            preview.src = window.navigator.userAgent.indexOf("Chrome") >= 1 || window.navigator.userAgent.indexOf("Safari") >= 1 ? window.webkitURL.createObjectURL(file_head.files[0]) : window.URL.createObjectURL(file_head.files[0]);        else {            file_head.select(),                file_head.blur(),                img_txt = document.selection.createRange().text,                localImag = document.getElementById("localImag"),                localImag.style.width = "63px",                localImag.style.height = "63px";            try {                localImag.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)",                    localImag.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = img_txt            } catch(f) {                return alert("您上传的图片格式不正确，请重新选择！"),                    !1            }            preview.style.display = "none",                document.selection.empty()        }        return document.getElementById("DivUp").style.display = "block",            !0    }</script></body></html>

来源 ::https://www.cnblogs.com/lijuntao/p/6527135.html

原文地址：https://www.cnblogs.com/liuq1991/p/8184307.html

时间： 2024-09-29 09:03:42

h5调用手机摄像头/相册的相关文章

HTML5调用手机摄像头,仅仅支持OPPOHD浏览器

1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>HTML5调用手机摄像头,仅仅支持OPPOHD浏览器</title> 6 <style> 7 #video { border: 1px solid #ccc; display:inline-block; } 8 #canvas

今天做手机网站,想实现手机扫描二维码功能.首先实现在浏览器中调用手机摄像头,实现拍照功能并且把拍下的照片显示在页面并上传到服务器上,然后再在服务器端进行分析. 首先实现在浏览器中调用摄像头,当然用现在火的不行的html5,html5中的<video>标签,并将从摄像头获得视频作为这个标签的输入来源.实现拍照功能的html5代码: <article> <style scoped> video { transform: scaleX(-1); } p { text-alig

H5调用设备摄像头和系统相册

1.调用设备摄像头 <input type="file" accept="image/*" capture="camera"> 2.调用系统相册 <input type="file" capture="camera"> 3.调用摄像头和系统相册 <input type="file" accept="image/*">

js 调用手机摄像头或相册并展示图片

效果图手机浏览器.微信打开该网页,都支持调用摄像头拍照和打开相册. 先看最终结果: 每次点击“点击上传”,可以选择相册或者拍照,选完以后可以多展示一张图片,此处没有做上传服务器. 点击“重新上传”,清空所有图片. PC浏览器打开,类似,不过只能选择图片文件: 代码把input type=file的标签透明度设置为0,使用绝对布局的方式用另一个标签覆盖它: <div id="imgPreview"> <div id="prompt3"> &

iOS开发之调用手机摄像头和相册

//按钮的点击方法- (void)catchImage { UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"请选择" message:@"选取照片" preferredStyle:UIAlertControllerStyleAlert]; UIAlertAction *action1 = [UIAlertAction actionWithTitle:@"相机&

h5调用手机前后摄像头，拍照

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="pacam.aspx.cs" Inherits="CRM3.cam.pacam" %> <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>H

Android调用手机摄像头使用MediaRecorder录像并播放

最近在项目开发中需要调用系统的摄像头录像并播放. 在开发中遇到了两个问题,记录下: (1)开发过程中出现摄像头占用,启动失败,报错.但是我已经在onDestory()中关闭了资源. 报错原因:打开程序,调用摄像头,按Home键再打开程序调用,报错摄像头被占用. 解决:在onStop()中关闭资源,在onResume()中判断是否为null,否则实例化资源. (2)其中我录像播放的代码写在Fragment+ViewPager中,在来回切换Fragment的时候,摄像头只能调用一次,并且所在的Fra

H5 调用手机软件的功能

1.调用邮件 : 参考 https://blog.csdn.net/github_38516987/article/details/77637546 (亲测有效) <a href="mailto:[email protected]">发送邮件</a> 2.调用拨打手机 <a href="tel:400-888-9999">400-888-9999</a> 3.调用短信 <a href="sms:1

H5调用本地摄像头

<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><title></title><script type="text/javascript" src="http://123.56.106.187:8010/Scripts/listjs/jquery-1.7.2.min.js">