演示用，比较简陋，勿怪，方法简单！
input被点击之后默认出现拍照，文档等选项，可以拍照上传，也可以选图库文件上传，也可以录像进行视频上传，自己对应修改文件类型判断就可以了这些功能无需调用cordova插件如果需要使用插件拍照上传，使用java作为后端的，可以参考
该方法是把图片base64编码成二进制流，可以存进数据库，调用的时候解码显示 使用php等其他非java作为后端的，同样可以把图片base64编码化，直接像存字符串那样存进数据库1.构建如图
对应源码
那里面那个action=127.0.0.1那个，改成自己的请求地址
如果需要多文件上传，input需要类似这样构建
<input type='file' name='photo1'>
<input type='file' name='photo2'>
<input type='file' name='photo3'>
或者
2.input绑定bind-change="uploadfileChange"
作用是监控input，看注释很清楚了Model.prototype.uploadfileChange = function(event) {
if (!event.target.files) { // 如果客户没有选择相关文件，直接返回 return; } var uploadimage = $(this.getElementByXid('uploadfile')); // 用jQuery拿到input标签 var file = event.target.files[0]; // 拿到用户选择的文件 if (/^image\/\w+$/.test(file.type)) { // 如果是图片文件 this.isimg = true; } else { // 如果用户选的的不是图片文件 justep.Util.hint('请选择图片文件！'); $uploadimage.val(''); }
};
3.上主菜
我的后端使用php做的，使用其他后端的，自行找一个对应的上传类对接就可以了Model.prototype.button1Click = function(event) { var form = this.getElementByXid("postForm"); // 拿到form表单的js对象 var acturl = "http://127.0.0.1/index.php/home/index/uploadcar"; form.attributes["action"].value = require.toUrl(acturl); // 提交表单 $(form).submit(function() { $(this).ajaxSubmit(function(resultJson) { alert(resultJson); }); return false; // 阻止表单默认提交 }); };
require("./baasd/jquery.form"); 路径改成自己的
5.加上后端吧，thinkphp 3.2的
public function uploadcar() {
$upload = new \Think\Upload(); // 实例化上传类$upload->maxSize = 1024 * 1000 * 10; // 设置附件上传大小$upload->exts = array('jpg', 'gif', 'png', 'jpeg'); // 设置附件上传类型$upload->rootPath = './upload/img_zj/'; //证件目录$upload->savePath = ''; // 设置附件上传目录$upload->autoSub = true; $upload->subName = array('date', 'Y/m/d');
$upload->saveRule = date("YmdHis", time()) . "_" . mt_rand(1000, 9999); //上传名已时间戳保存// 上传文件 $info = $upload->upload();
if (!$info) { //上传失败 // 上传错误提示错误信息 $this->error($upload->getError());} else { //上传成功 $imgpath = '/upload/img_zj/' . $info['photo']['savepath'] . $info['photo']['savename']; echo $imgpath; }
}
我这里直接返回的就是图片地址，你可以把3里面直接改造，类似我这样写法
var xszimg = this.getElementByXid("xszimg");$(form).submit(function() { $(this).ajaxSubmit(function(resultJson) { $(xszimg).attr("src", transURL(resultJson)); $(xszimg).show(); }); return false; // 阻止表单默认提交 }); 这样直接就把图片显示出来了