jQuery 关于文件上传表单处理的一个非常怪异的问题

发布于 2021-11-04 09:03:06 字数 1524 浏览 733 评论 9

jQuery 有个插件 jQuery.Form ,这个插件功能很强大,可以用来处理文件上传的表单。

下面是这个问题的描述:

假设有这么一个表单

<form id="form_img" action="/action/upload" method="POST" enctype="multiple/form-data">
<input type="file" name="img"/><input type="submit" value="上传"/>
</form>

我们可以用下面的脚本来提交

$('#form_img').ajaxForm({
    success: function(html) {
        alert(html);
    }
});

假设上传页面的地址是 http://www.oschina.net/upload.html

那么处理文件上传请求的地址就是 http://www.oschina.net/action/upload

我们引入jquery的js文件的代码如下(为了将所有静态文件独立存放,我们使用了一个 http://static.oschina.net 的域名):

<script type="text/javascript" src="http://static.oschina.net/js/jquery.js?ver=1.3.2"></script>
<script type="text/javascript" src="http://static.oschina.net/js/jquery.form.js?ver=2.21"></script>

接下来选择要上传的文件并点击上传按钮时,后台程序显示文件上传成功,但是页面上有一个 alert(html) 却不执行。

而我们只需要把引入js的代码改为:

<script type="text/javascript" src="/js/jquery.js?ver=1.3.2"></script>
<script type="text/javascript" src="/js/jquery.form.js?ver=2.21"></script>

去掉js文件的主机头后,页面就可以正常显示提示信息。


到此问题描述结束,这个问题花了三个小时才解决,但还是不知道是什么原因导致,我知道这个插件为了处理文件上传做了很多复杂的处理,也没去细看它的源码。

另外我发现这个问题的现象跟Ajax在进行跨域名调用时的现象是一致的,在浏览器端表现为没有任何的提示信息、没有任何反应,但也没报脚本错误之类的信息。

很是困惑,有空要好好看看 jquery.form 这个插件的代码。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(9

绝影如岚 2021-11-08 20:58:36

IE浏览器总是把json变成下载,这是为什么呢?

苍暮颜 2021-11-08 20:56:20

引用来自“cg20061563”的帖子

怎样获得,servlet中返回的值,把它放到target中去?

月亮是我掰弯的 2021-11-08 20:55:41

怎样获得,servlet中返回的值,把它放到target中去?

三月梨花 2021-11-08 20:54:03

$('#form_img').ajaxForm({
   beforeSubmit : function(){
     $('#form_img').attr("action","http://www.oschina.net/upload");
   },
    success: function(html) {
        alert(html);
    }
});

奢望 2021-11-08 20:48:09

我是想上传后,把一些信息(Servlet处理后的),输出到另一个页面中的一个结点里面。

北笙凉宸 2021-11-08 16:06:47

能不能给详细一点,我是刚接触jquery,beforeSubmit : function(){
   $('#form_img').attr("action",http://www.oschina.net/upload);}

这个放在哪里?

睫毛上残留的泪 2021-11-08 16:01:35

可以写
beforeSubmit : function(){
   $('#form_img').attr("action","http://www.oschina.net/upload");
}

好听的两个字的网名 2021-11-08 07:11:12

可不可以把 form中的action为空,把原来action中的值,放在

$('#form_img').ajaxForm({
    success: function(html) {
        alert(html);
    }
});中,用js来提交上传表单,如果能的话,应该怎样写呢?

我qq:619758779,急需要。

清风夜微凉 2021-11-08 06:39:02

ajaxForm很少用,一般我都不作载入绑定的。

直接用按钮触发, 调用ajaxSubmit是个不错的选择。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文