jquery 的ajax无刷新上传文件之后,页面还是会莫名的刷新-----解决办法
文件上传用到全局数组: $_FILES

只需要把下面的 <button onclick="post()">提交</button> 改为 <input type="button" onclick="post()" value="提交"/>就不会刷新页面了!!!
参考 http://bbs.csdn.net/topics/391852021
what fuck ... sb html 我在那愣是提交了半个小时,还是一直刷新,找不到问题所在。 原因是我的提交按钮用的是button标签,后来改成了 <input type="button"> 就尼玛可以了 真是无语了


file.html
<html>
<head>
<meta content="" charset="UTF-8"/>
<script src="./jquery.js"></script>
</head>
<form enctype="multipart/form-data" enctype="multipart/form-data">
请选择文件<input type="file" name="file"/>
<button onclick="post();">提交</button>
</form>
<script>
function post() {
alert("in post");
var formData = new FormData();
//var formData = new FormData($("form")[0]);
formData.append('file', $('input[name=file]')[0].files[0]);
$.ajax({
url: './file.php',
type: 'POST',
cache: false,
data: formData,
processData: false,
contentType: false,
async: true
}).success(function(){
alert("success!");
}).error(function(){
alert("error");
}); } </script>
</html>
file.php
<?php
file_put_contents("./a.txt", var_export($_FILES, true));
//var_dump($_FILES);exit; if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "text/plain"))
&& ($_FILES["file"]["size"] < 20000))
{ file_put_contents("./a.txt", "\n in \n", FILE_APPEND);
if ($_FILES["file"]["error"] > 0)
{
echo "Return Code: " . $_FILES["file"]["error"] . "<br />";
}
else
{ file_put_contents("./a.txt", "\n in else\n", FILE_APPEND);
/* echo "Upload: " . $_FILES["file"]["name"] . "<br />";
echo "Type: " . $_FILES["file"]["type"] . "<br />";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " Kb<br />";
echo "Temp file: " . $_FILES["file"]["tmp_name"] . "<br />";
*/ if (file_exists( $_FILES["file"]["name"]))
{
// echo $_FILES["file"]["name"] . " already exists. ";
file_put_contents("./a.txt", "\n already exists \n", FILE_APPEND);
}
else
{
file_put_contents("./a.txt", "\n in create file \n", FILE_APPEND);
move_uploaded_file($_FILES["file"]["tmp_name"],
$_FILES["file"]["name"]);
// echo "Stored in: " . $_FILES["file"]["name"];
}
}
}
else
{
echo "Invalid file";
}
?>

这样的结果才是正确的,页面 /file.html 没有刷新, 解决办法是submit 按钮改成了
<input type="button" value="提交"/>
---------------------------------
而之前的按钮是 <button>提交</button>,这样文件上传成功之后是会刷新页面的,去请求 /file.html?file=file.txt 这个路径的文件,很是奇怪!!!

点击提交


jquery 的ajax无刷新上传文件之后,页面还是会莫名的刷新-----解决办法的更多相关文章
- jQuery 关于IE9上传文件无法进入后台问题的原因及解决办法(ajaxfileupload.js第四弹)
第四弹的诞生完全不在自己最初的计划之中,是有个网友看了先前关于<ajaxfileupload.js系列>的文章后提出的问题,由于自己一直是用chrome浏览器去测试demo,完全忽略IE浏 ...
- 上传文件,经过Zuul,中文文件名乱码解决办法
转载请标明出处: http://blog.csdn.net/forezp/article/details/77170470 本文出自方志朋的博客 问题描述 在项目中又一个上传文件的oss服务,直接调用 ...
- SpringBoot上传文件,经过spingCloud-Zuul,中文文件名乱码解决办法
最近用springCloud整合springboot做分布式服务发现经过zuul之后上传的中文文件名乱码全都变成?????,从而引发异常,单独用springboot却是好的,在网上找到相关资料总结如下 ...
- 上传文件报413 Request Entity Too Large错误解决办法
产生这种原因是因为服务器限制了上传大小 1.nginx服务器的解决办法 修改nginx.conf的值就可以解决了 将以下代码粘贴到nginx.conf内 client_max_body_size 20 ...
- vue-quill-editor 封装成组件;图片文件流上传;同一页面多个编辑器样式异常解决办法
使用方法: 引入并注册组件,然后直接使用: @getcode是同步获取编辑器内容的::contentDefault是编辑器的默认内容: 注意:如果同一个页面多个编辑器,参数id不能相同,否则只有第一个 ...
- jquery ajax php 无刷新上传文件 带 遮罩 进度条 效果的哟
在很多项目中都会叫用户上传东西这些的,自从接触了jquery 和ajax之后就不管做什么,首先都会想到这个,我这个人呢?是比较重视客户体验的,这次我这边负责的是后台板块,然后就有一块是要求用户上传照片 ...
- jQuery+php+ajax实现无刷新上传文件功能
jQuery+php+ajax实现无刷新上传文件功能,还带有上传进度条动画效果,支持图片.视频等大文件上传. js代码 <script type='text/javascript' src='j ...
- ajax +jsp+iframe无刷新上传文件[转]
http://hi.baidu.com/zj360202/blog/item/f23e3711f929c774cb80c475.html ajax jsp 无刷新上传文件 2009-10-26 16: ...
- ajax无刷新上传文件
网页上传文件最简单的方式就是通过表单上传了,但是在提交表单的时候会导致网页刷新,但有的时候我们不想网页刷新,有什么办法呢,我们可以使用ajax上传文件来做到这一点.只有ajax还不行,还需要JavaS ...
- web 开发之js---巧用iframe实现jsp无刷新上传文件
首先要说的就是 ajax 是无法实现上传文件的,可以想一下ajax与后台通信都是通过传递字符串,怎么能传递文件呢?其实出于安全考虑js是不能操作文件的,所以就不要再说用ajax来实现文件的上传了,这是 ...
随机推荐
- 【洛谷4219】[BJOI2014]大融合(线段树分治)
题目: 洛谷4219 分析: 很明显,查询的是删掉某条边后两端点所在连通块大小的乘积. 有加边和删边,想到LCT.但是我不会用LCT查连通块大小啊.果断弃了 有加边和删边,还跟连通性有关,于是开始yy ...
- scala的Class
先看类的定义: package com.test.scala.test import scala.beans.BeanProperty /** * scala 的类 */ //定义一个scala的类 ...
- Spring Cloud (10) Hystrix-监控面板
Hystrix DashBoard 断路器是根据一段时间窗内的请求状况来判断并操作断路器的打开和关闭状态的.Hystrix Dashboard是作为断路器状态的一个组件,提供了数据监控和友好的图形化界 ...
- Linq学习(零)-错误汇总
问题一: Cannot execute text selection: CS0009 Metadata file 'C:\Users\Kimisme\Documents\LINQPad Plugins ...
- python gdal 修改shp文件的属性值
driver = ogr.GetDriverByName('ESRI Shapefile')datasource = driver.Open(shpFileName, 1)layer = dataso ...
- 1B课程笔记分享_StudyJams_2017
课程1B 概述 课程1B主要讲解了Android UI的ViewGroups(视图组).LinearLayout(线性布局).RelativeLayout(相对布局),Portrait Mode(竖屏 ...
- Win32子窗口的创建
本文主要是在一个主窗口下创建一个子窗口.主窗口有一个菜单,菜单下只有设置一个选项,点击设置选项,弹出设置界面,点击设置界面关闭则关闭.我在开发的时候遇到两个问题,第一就是一点设置关闭就整个应用都关了, ...
- JS——event
触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息: 普通浏览器支持 event(传参),IE678支持 window.event(无参),兼容写法: < ...
- JS——预解析
1.排查语法错误 <script> console.log(1; </script> 2.变量提升和函数整体提升 <script> console.log(n1); ...
- 6、scala Map和Tuple
1. 创建Map 2.访问Map元素 3.修改Map元素的值 4.遍历Map 5.SortedMap和LinkedHashMap 6.Map的元素类型Tuple 1. 创建Map 创建不可变的Ma ...