当前访客身份：游客 [
如果有一天，你发觉日子过得特别艰难，不要气馁！那可能是这次的收获将特别地巨大！
：先谢谢楼主，再观摩！
：谢谢楼主，我试过在三星的Note3 跟 4下，微信内置...
：正好需要，谢谢楼主，什么时候能提供jquery版本呢...
：大神，方向问题能不能解决啊
：Chrome Uncaught ReferenceError: MegaPixImage ...
：华为荣耀6，Android 4.4.2 ，微信5.3.1不行，自带...
：安卓目前最新版的微信5.3.1还是无法响应，好像之...
：引用来自“smilingsmile”的评论为什么我用苹果4...
：引用来自“smilingsmile”的评论为什么我用苹果4...
：引用来自“smilingsmile”的评论为什么我用苹果4...
今日访问：0
昨日访问：7
本周访问：61
本月访问：170
所有访问：13542
HTML5+Canvas手机拍摄，本地压缩上传图片，案例实测报告。
发表于2年前( 10:32)&&
阅读（18451）&|&评论（）
0人收藏此文章,
& 做了个微信的HTML5拍摄上传照片功能，问题重重...
& 前端代码
$(':file').on('change',function(){
&&&&&&&&var&file&=&this.files[0];
&&&&&&&&var&url&=&webkitURL.createObjectURL(file);
&&&&&&&&/*&生成图片
&&&&&&&&*&----------------------&*/
&&&&&&&&var&$img&=&new&Image();
&&&&&&&&$img.onload&=&function()&{
&&&&&&&&&&&&//生成比例
&&&&&&&&&&&&var&width&=&$img.width,
&&&&&&&&&&&&&&&&&&&&height&=&$img.height,
&&&&&&&&&&&&&&&&&&&&scale&=&width&/&
&&&&&&&&&&&&width&=&parseInt(800);
&&&&&&&&&&&&height&=&parseInt(width&/&scale);
&&&&&&&&&&&&//生成canvas
&&&&&&&&&&&&var&$canvas&=&$('#canvas');
&&&&&&&&&&&&var&ctx&=&$canvas[0].getContext('2d');
&&&&&&&&&&&&$canvas.attr({width&:&width,&height&:&height});
&&&&&&&&&&&&ctx.drawImage($img,&0,&0,&width,&height);
&&&&&&&&&&&&var&base64&=&$canvas[0].toDataURL('image/jpeg',0.5);
&&&&&&&&&&&&//发送到服务端
&&&&&&&&&&&&$.post('upload.php',{formFile&:&base64.substr(22)&},function(data){
&&&&&&&&&&&&&&&&$('#php').html(data);
&&&&&&&&&&&&});
&&&&&&&&$img.src&=&
$base64&=&$_POST['formFile'];
$IMG&=&base64_decode(&$base64&);
file_put_contents('1.png',&$IMG&);
chrome 版本29，上传成功，源图片3M，压缩后1024 * 比例，约250kb 通过！
android 版本4+，微信，点击上传无反应，在手机浏览器中打开可上传，拍摄约3M-，压缩后1024* 比例，约3M-，根本没压缩嘛！！！ 失败！
iphone4 & 4s 版本6+ 微信，拍摄约3M-，压缩后1024 * 比例，约250kb 通过!
iphone5 版本6+ 微信，生成canvas变形。失败！
总结：系统级BUG，无解.... 这下不知道怎么办了..&
--------------------------------------- 后续报告 日 ----------------------------------------------
找到个牛人写的javascript编译jpg的插件，javascript_jpeg_encoder。
用这个办法可以解决android无法压缩图片的问题。
目前还剩2个系统级BUG。
1. 微信android版本无法响应上传控件 input tyle=
2. iphone5 生成canvas失败，画面扭曲。
--------------------------------------- 后续报告2 日 ---------------------------------------------
同样有一位牛人写的&ios-imagefile-megapixel&插件，解决了iphone5+画面扭曲的问题。
目前还剩1个系统级BUG。
微信android版本无法响应上传控件 input tyle=
--------------------------------------- 后续报告3 日 ---------------------------------------------
目前所有问题都解决了，在上建立了插件，有需要的朋友可以去获取一下，顺便说一下，时间过的真快。：D
1)">1)">1" ng-class="{current:{{currentPage==page}}}" ng-repeat="page in pages"><li class='page' ng-if="(endIndex<li class='page next' ng-if="(currentPage
相关文章阅读做了个html网页提供下载功能,但是下载后打不开文件压缩包,求一个解决方法
[问题点数：20分，结帖人changeking]
做了个html网页提供下载功能,但是下载后打不开文件压缩包,求一个解决方法
[问题点数：20分，结帖人changeking]
不显示删除回复
显示所有回复
显示星级回复
显示得分回复
只显示楼主
相关帖子推荐：
本帖子已过去太久远了，不再提供回复功能。为什么我电脑下的微信安装包都是压缩包ZIP，但是别人同样页面下下来的却是apk格式，只有apk格式才能装啊！_百度知道
为什么我电脑下的微信安装包都是压缩包ZIP，但是别人同样页面下下来的却是apk格式，只有apk格式才能装啊！
我的系统是WIN7，防火墙是NOD32求大神支招！
是怎么回事我的意思是我需要APK格式！但是我的电脑下下来不是APK格式！~不需要ZIP格式
提问者采纳
你在设置机型的时候选择错了，请选择安卓机型的手机。这样下载的就是APK格式的安装包了。
提问者评价
谢谢！我决定不弄了，等别人帮我弄！~
其他类似问题
您可能关注的推广
apk的相关知识
按默认排序
其他2条回答
百度了下 apk格式
是手机上的
我就是需要APK格式啊！~那个下下来就是需要装到手机里的！我用电脑下下来确是ZIP格式的压缩包！~ 而且解压里面也没有APK格式的安装包！~
这让我很困扰啊！
你下载的机型有没有选 对。
这和机型没有关系的！~我所有在微信页面下载下来的东西全都是ZIP格式！~包括安卓的操作系统！~都是个ZIP格式的压缩包！~我都不想说了！~这是不是我WIN7的设置有问题？
那你就直接，把你下载的文件，放手机里。就行了。
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁iOS 启动页面被压缩什么原因_百度知道
iOS 启动页面被压缩什么原因
系统设置。谢谢大家回答，那么就无法使照片全显示,主题照片是竖长的，请问如何做手机壁纸我的手机，我不要截屏：中兴,V880问题类型，但是系统需要截图，我想请教大家如何用照片做壁纸。如果不得不截屏
其他类似问题
ios的相关知识
按默认排序
其他1条回答
没有适配其他屏幕
只是启动界面被压缩了，其他界面都好着呢
对。你用的不是xib吧。用的是Images.xcassets里的》？你要在图片里加上其他尺寸的。
我就用的就是xib,不知道是什么原因？界面图片较多
xib没用过，一直用Images.xcassets里的LaunchImage可能是你xib适配的问题。之前我也出现过这种问题。就是缺少图片导致的。
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁页面导航：
→ 正文内容 jQueryMobile之Helloworld与页面切换
jQueryMobile之Helloworld与页面切换的方法
这篇文章主要介绍了jQueryMobile之Helloworld与页面切换的方法,实例分析了jQueryMobile的基础用法,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了使用jQueryMobile实现滑动翻页效果的方法。分享给大家供大家参考。具体分析如下：
jQuery Mobile是jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。就是能够迅速能把页面写成APP的界面，让用户浏览网页，相当于在使用布局好的app一样。
首先要在jQueryMobile（）下载一个压缩包，然后把这个压缩包的所有内容拉到你的站点文件夹，虽然在网页仅仅是引用jquery.mobile-1.4.5.js与jquery.mobile-1.4.5.css，但是其他的辅助文件除了说明文档demo文件夹外缺一不可。即使它的js文件与css文件，但它不像Bootstrap一样，把所有功能集成到一个js里面，如果缺乏某些文件夹，某些图标可能无法显示。而且，请把原根文件夹jquery.mobile-1.4.5的名字改成jqmobile或者其他，反正文件夹中别有.-这些标点符号，否则，在网页中引用jquery.mobile-1.4.5.js与jquery.mobile-1.4.5.css可能失效。
同时，jquery.mobile作为一个插件，需要jQuery1.11支持，可以到jQuery官网中下载兼容旧浏览器IE6的jQuery1.11，而不是不兼容旧浏览器IE6的jQuery2。把下载到的jQuery1.11.js也与jQueryMobile的文件放在一起吧。如下图：
之后就可以在网页编写页面，代码如下，详情请看注释。
代码如下:&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&&
&html xmlns="http://www.w3.org/1999/xhtml"&&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&&
&title&a&/title&&
&!--要求自动适应屏幕，不允许手机用户自由调整页面尺寸--&&
&meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"&&
&link rel="stylesheet" href="jqmobile/jquery.mobile-1.4.5.css"&&
&script src="jqmobile/jquery-1.11.1.js"&&/script&&
&script src="jqmobile/jquery.mobile-1.4.5.js"&&/script&&
&!--定义一个page容器，所有组件都必须写在里面，要求其填充到整个屏幕--&&
&div data-role="page" data-position="fixed" data-fullscreen="true"&&
&!--这就是标题栏，在最新的jqmobile中，自带的主题只删得只剩黑白两色，data-theme="a"为白，data-theme="b"为黑--&&
&!--data-tap-toggle = "false"是禁止用户点击页面内容，也就是content就隐藏页脚--&&
& &div data-role="header" data-theme="b" data-tap-toggle = "false"&&
&&& &h1&Title&/h1&&
& &div data-role="content"&&
&&& &p&中文是没有问题的aaa&/p&&
& &div data-role="footer" data-position="fixed" data-fullscreen="true"& data-theme="b" data-tap-toggle = "false"&&
&&&&& &div data-role="navbar"&&
&&&&& &ul&&
&&&&& &!--让a按钮处于凹陷状态，使用info图标，在按钮中跳转到其它页面，要使用target="_self"，否则链接出错--&&
&&&&&&& &li&&a href="#" class="ui-btn-active ui-state-persist" data-icon="info"&a&/a&&/li&&
&&&&&&& &li&&a href="b.html" target="_self" data-icon="grid"&b&/a&&/li&&
&&&&&&& &li&&a href="c.html" target="_self" data-icon="star"&c&/a&&/li&&
&&&&& &/ul&&
&&& &/div&&
& &/div&&&
于是，就可以写出如下的网页：
其中w3cschool上对于主题的论述有些过时，请注意，最新版本的jQueryMobile的自带主题删得只剩下两种。jQueryMobile的自带图标如下：
在调试的使用，应该使用谷歌浏览器、火狐浏览器等高级浏览器，因为WIN7自带的IE8出现很多兼容性的问题，毕竟这货就是用来写手机页面的，因此别妄想把jQueryMobile运用到电脑页面上去。
希望本文所述对大家的jQueryMobile程序设计有所帮助。
您可能感兴趣的文章:
上一篇：下一篇：
最 近 更 新
热 点 排 行
12345678910