form表单ajax上传图片方法

先引用jquery.form.js

前台代码
<pre>
<form id="form1">
<input id="file_temporaryImage" type="file" name="file_temporaryImage" onchange="TemporaryMedia();"/>
<input type="hidden" id="userpicpath">
<img id="userpic" src=""/>
</form>
<script>
function TemporaryMedia() {
//var image0 = $("input[name='file_temporaryImage']").val();
//判断上传控件中是否选择了图片
var image = $("#file_temporaryImage").val();
if ($.trim(image) == "") {
alert("请选择图片!");
return;
}
//提交请求处理的url
var actionUrl = "/home/kelatoupiao/sctpic/";
//开始ajax操作
$("#form1").ajaxSubmit({
type: "POST",
dataType: "json",
url: actionUrl,
data: {},
success: function (data) {
if (data.success == 1) {
$('#userpicpath').val(data.data);
$('#userpic').attr('src',data.data);
} else {
alert(data.msg);
}

}

});

}
</script>
</pre>

PHP后台代码
<pre>
//上传图片
public function sctpic()
{
$openid = $this->_check_login();
$spath = __DIR__ . '/../../../Public/kelatoupiao/uploads/' . $openid . '_' . time() . '.jpg';
$webpath='/kelatoupiao/uploads/' . $openid . '_' . time() . '.jpg';
if (move_uploaded_file($_FILES["file_temporaryImage"]["tmp_name"], $spath)) {
echo json_encode(array('success' => 1, 'msg'=>'上传成功','data'=>$webpath));
exit();
} else {
echo json_encode(array('success' => 0, 'msg'=>'网络繁忙','data'=>''));
exit();
}
}
</pre>

php form表单ajax上传图片方法的更多相关文章

  1. ant-pro使用Form表单验证上传图片出现的问题

    1.复现:用antd的Form表单验证上传图片必填项时出现问题:复现过程,先提交,提示图片需要上传,上传成功后,依旧提示:图片未上传 2.表单验证原理:先理解一下antd的Form表单验证的表层原理, ...

  2. form表单ajax提交

    这里下面有两种  第一种是form表单里面添加了数据,并且含有上传的图片,第二种是from表单中不含有图片  只有普通数据 第一种form表单中包含有图片的类型: <form method=&q ...

  3. JS form表单提交的方法

    1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写:有两种方法,一种是用submit提交.一种是用button提交.方法一: 在jsp的前端页面的 ...

  4. html中form表单的使用方法和介绍

    from表单的使用方法 一.表单赏析 二.了解表单功能:用于搜集不同类型的用户输入的内容 有了表单,网页的内容可以由用户自己创建,那么对于网页来说,我们既是网页创建都者,也是网页的消费者. 三.常用的 ...

  5. form表单提交的方法

    最近研究了下html中,form保单提交的几种方法,现与大家分享一下(注:网上可能已经有好多版本了,这里自己写下来做个总结了,哈!): 方法一:利用form的onsubmit()函数(经常使用) &l ...

  6. 在form表单里上传图片

    需要上传多个图片分别上传,本来提供的工具类里上传一张可以form表单对象实现 后台用MultipartFile file var formdata = new FormData($("#in ...

  7. 通过jQuery的Ajax方式来提交Form表单

    通过jQuery的Ajax方式来提交Form表单 $.ajax({ url:ajaxCallUrl, type:"POST", cache:true, async:false, d ...

  8. [js开源组件开发]query组件,获取url参数和form表单json格式

    query组件,获取url参数和form表单json格式 距离上次的组件[js开源组件开发]ajax分页组件一转眼过去了近二十天,或许我一周一组件的承诺有了质疑声,但其实我一直在做,只是没人看到……, ...

  9. form表单提交数据编码方式和tomcat接受数据解码方式的思考

    http://blog.sina.com.cn/s/blog_95c8f1ac010198j2.html *********************************************** ...

随机推荐

  1. SQL Server 2014查看服务器数据库字段报错 (Microsoft.SqlServer.Management.Sdk.Sfc)

    报错信息 无法为该请求检索数据. (Microsoft.SqlServer.Management.Sdk.Sfc) 未知属性 IsMemoryOptimized (Microsoft.SqlServe ...

  2. Markdown温故知新(1):Markdown面面观

    1.什么是 Markdown? 2.有哪些人在用 Markdown? 3.用 Markdown 的优势是什么? 4.Markdown 的语法标准简介 5.怎么用 Markdown? 6.如何选择 Ma ...

  3. 《Real World Haskell》内容脉络整理

    p.s.  其实就是28–(6入门[1~4,6])-(10暂不用[17,20~28])=13网页啊! 1~ 6 章: 语法入门 (类型,函数,表达式语法糖,typeclass) 7~13章:  熟练/ ...

  4. laravel 框架配置404等异常页面的方法详解(代码示例)

    本篇文章给大家带来的内容是关于laravel 框架配置404等异常页面的方法详解(代码示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 在Laravel中所有的异常都由Handl ...

  5. Vue开发日志

    一 搭建环境 mac 安装node brew install node 安装vue 全家桶 npm install -g vue-cli 选择一个目录做初始化 vue init webpack myp ...

  6. Vue递归组件实现层层嵌套显示数据

    问题来自朋友...记录一下 需求是表格头部后端返回的数据中是不确定的 n维数据,表头存在于 listVo 字段中,如何实现层层显示呢? 温馨提示,以下内容为5张大图,请打开 WIFI 享用... 以下 ...

  7. SQL Server Compact 3.5环境部署<转>

    通过使用 Microsoft Visual Studio 开发环境,可以开发使用 SQL Server Compact 3.5 的应用程序.Visual Studio 是开发和部署使用 SQL Ser ...

  8. 跟着9张思维导图学习Javascript js 关键字和保留字 css3中的BFC,IFC,GFC和FFC

    跟着9张思维导图学习Javascript   学习的道路就是要不断的总结归纳,好记性不如烂笔头,so,下面将 po 出我收集的 9 张 javascript 相关的思维导图(非原创). 思维导图小ti ...

  9. 简明conda使用指南

    目录 区分conda, anaconda, miniconda conda版本 虚拟环境 分享环境 查看某个环境的位置 列出软件包 安装软件包 删除软件包 查找软件包 conda配置 conda实践: ...

  10. python脚本测试websocket接口协议

    import websocket url = 'wss://host:port/rt/tr' #websocket连接地址 ws = websocket.create_connection(url) ...