【相关学习推荐:java基础教程】
说明 :
图片服务器是用Nginx搭建的,用的是PHP语言
这个功能 需要 用到两个js文件:
jquery.js和jQuery.formu ~ : ` a A T.js
<script type="text/JavaScript" src="https://www.php.cn/js/jquery.js"&gx : G x Ut;&H 2 _ E Ult;/K d c - L o q , nscript&V Z - { % B mgt; <script type=T G Y p / o"tex% ! 1 t Y & D v rt/javascript" src="https://www.php.cn/js/jquery.form.js"></scro A f ! 8 0 Kipt> <form id="upload-f, ? B c ) x w ! }orm" encte H 8 b ; [ o m yype="multipart/form-datS S 2 [ va" method="post" action="http://u01.mada4 ( f h ] w Oilvxing.cn/images/upload.php"> <input type="file" name="pic[]"> <E 6 hinput tyJ O zpe="hidden" name="MAX_FILE_SIZE" val& s r : {ue="10000000"> <input type="submit" name="sub" value="上传" onclick="submitImgSize1_ ? lUpload()"> </form> <script type="t5 5 F a a Fext/javascript"> function submitImgSize1Upload() { var postData = function) 8 a ^ 5 t( form , callback)^ i v ; p 0{ var form = document.getElementById("upload-foh h 6 P ( + ; U prm");//获取表单的数据 var formdata = new FormData( form );//格式化表单数据 $.ajax({ url: “跨域的url", type: "post", data: formdata, //处理表单数据 datc n 6 Y P 9aType: 'json', processData: faG m G ~ V ? G (lse, contentType: false, //suc9 @ . Ocess: function(data){ // alert(data); // }, // error: function(data){ // conS e Q = 8 y F @sole.log(data); // } }) $(".submit-btn^ d H").on("click",funcd c { vtion(){ postData($(this).parents(B = u } u a ^ s"form")[0]); }) }
下面是上传成功截图:
下图是上传成功后访问图片:访问地址:http://u01.madailvxing.cn/images/201G t %7_09/ec16243fa22^ I ) c r ; M H 5a20bb757G 9 P z V , L w3101f955a7f83.jpg
2017_9:文件夹名
en } 5 w s ^ Qc16244 K /3fa22a20bb7573101f955a7f83:php同事那边随机生成的这张图片的文件名
相关文章推荐:ajax视频教程
以上就是掌握Java使用Ajax实现跨域上传图片功能的详细内容。