<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src='http://code.jquery.com/jquery-1.9.1.min.js'></script>
<script src='jquery.base64.js'></script>
<script type="text/javascript"> //base64转码函数
function base64(file, callback)
{
var coolFile = {};
function readerOnload(e)
{
var base64 = btoa(e.target.result);
coolFile.base64 = base64;
callback(coolFile)
}; var reader = new FileReader();
reader.onload = readerOnload; var file = file[0].files[0];
coolFile.filetype = file.type;
coolFile.size = file.size;
coolFile.filename = file.name;
reader.readAsBinaryString(file);
} function aa()
{ //var preview = document.querySelector('img');
//var file = document.querySelector('#files').files[0];
var name = $('#files').val(); base64($('input[type="file"]'), function(data)
{
//console.log(data.base64)
var data = {
"file":{
"file":data.base64,
"filename":name,
"filepath":"public://"+name
}
}; options = {
type:"post",
data:data,
url: "http://demo.dd:8083/userapi/app_services/UploadFile",
dataType: 'json',
success:function(result){
console.log(JSON.stringify(result));
}
};
$.ajax(options);
}) } </script>
</head>
<body>
<input type="file" id="files" value="图片上传">
<input type="button" value="上传" id="bb" onclick="aa()"> <br>
<hr>
<img src="" height="200" alt="Image preview...">
</body>
</html>

使用javascript把图片转成base64位编码,然后传送到服务端(ajax调用的接口基于drupa7)的更多相关文章

  1. Base64字符保存图片,图片转换成Base64字符编码

    //文件转换成Base64编码 public static String getFileBase64Str(String filePath) throws IOException { String f ...

  2. 图片转成base64位 页面中图片展示

    <img src="data:image/gif;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABG ...

  3. JS将图片转换成Base64码

    直接上代码 html页面代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  4. 网络图片转换到本地并转换成base64位

    /** * 网络图片转换到本地并转换成base64位 * @param $url * @return string */ public function imgzhuanhuan($url) { // ...

  5. delphi将图片转换成Base64编码函数

    {************************************************************************** 名称: BaseImage 参数: fn: TF ...

  6. java 图片转换成base64字符串

    import java.io.ByteArrayOutputStream; import java.io.FileInputStream;import java.io.FileOutputStream ...

  7. js绝对地址图片转换成base64的方法

    //将图片转换成base64 function getBase64Image(url, callback){ var canvas = document.createElement('canvas') ...

  8. Java对网络图片/本地图片转换成Base64编码和解码

    一.将本地图片转换成Base64编码字符串 /** * 将本地图片转换成Base64编码字符串 * * @param imgFile 图片目录路径 * @return */ public static ...

  9. php 处理图片 将图片转成base64

    1.直接将图片路径传入下面该方法就可以了//将图片转成base64 public function imgToBase64($img_file){ $img_base64 = ''; if ($img ...

随机推荐

  1. HTML——JAVASCRIPT——关灯效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. beforefieldinit释义(3)

    1.看下面的例子: public static class MyClass<T> { public static readonly DateTime Time = GetNow(); pr ...

  3. OpenAL

    http://blog.csdn.net/luckilyyu/article/details/6894707

  4. ASP .Net Core 使用 Dapper 轻型ORM框架

    一:优势 1,Dapper是一个轻型的ORM类.代码就一个SqlMapper.cs文件,编译后就40K的一个很小的Dll. 2,Dapper很快.Dapper的速度接近与IDataReader,取列表 ...

  5. bootstrap 3 のcheckbox-inline

         <div class="form-group">      <p class="control-label"><b> ...

  6. GetLastError来获得错误信息转成文本描述

    我们一般在调用了一些API后都会用GetLastError来获得错误信息,但是信息都是Integer的,我们知道是什么意思么?嘿嘿,是的,有msdn呀,当然还可以用FormatMessage函数来.正 ...

  7. java的深复制与浅复制

    今天座右铭-----浪费时间就等于慢性自杀 ⑴浅复制(浅克隆) 被复制对象的所有变量都含有与原来的对象相同的值,而所有的对其他对象的引用仍然指向原 来的对象.换言之,浅复制仅仅复制所考虑的对象,而不复 ...

  8. 普林斯顿大学算法课 Algorithm Part I Week 3 排序稳定性 Stability

    稳定性(Stability):先按性质A排序,再按性质B排序,性质B相同的那些项是否仍然是按性质A排序的? 一个稳定的排序,相同值的元素应仍保持相对顺序(relative order) 稳定的算法:插 ...

  9. javascript第七课js函数

    function add() { } 上面就是js中的方法,js中的方法与c#中的方法不同的是不需要写返回值类型 function  add(num1,num2) { return num1+num2 ...

  10. 在asp.net中如何实现伪静态页 [转]

    我在这里就不过多讨论静态页.伪静态页.动态页的长短利弊了.只是单纯的讲解如何在asp.net中如何实现伪静态页,以帮助有这方面有需求的朋友,快速解决boss派下来的任务.(拿奖金的时候,记得有我一份功 ...