ajax(iframe)无刷新提交表单、上传文件

2016-02-19 10:08 29 1 收藏

今天图老师小编给大家展示的是ajax(iframe)无刷新提交表单、上传文件,精心挑选的内容希望大家多多支持、多多分享,喜欢就赶紧get哦!

【 tulaoshi.com - Web开发 】

找遍资料得出结果:不能
不过同时也找到了解决办法,就是用iframe的方式来提交表单,即实现无刷新提交表单又可以上传文件!
一、HTML代码
代码如下:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
title无刷新提交表单/title
script type="text/javascript"
!--
function callback(str){
alert(str);
}

// --/script
/head
body
form name="form1" method="POST" action="../post.php" target="post_frame" enctype="multipart/form-data"
iframe name='post_frame' id="post_frame" style="display:none;" mce_style="display:none;"/iframe
input type="file" name="img" /
input name="power[]" type="text"/
input type="submit" value="完成以上修改" name="submit" /
/form
/body
/html

二、PHP代码(处理代码)
这里的代码就想怎么写怎么写了,不过这个里执行完了刚才那个HMTL页面应该要有所表现,这时就要用到上个页面中的 function callback()了
代码如下:

echo ("script type="text/javascript"parent.callback('操作成功 ! ')/ script");

来源:http://www.tulaoshi.com/n/20160219/1593496.html

延伸阅读
标签: Web开发
1.建立一个aspx页面 html代码 html xmlns="http://www.w3.org/1999/xhtml" head id="Head1" runat="server"     title小山/title     link type="text/css" href="../../Styles/tree_css/tree.css" rel="stylesheet" /head body     form id="Form1" runat...
标签: Web开发
做公司网站时的一个应用,用猫东的表单验证插件做实时的验证,和jquery的ajax提交数据,获取评论的时候加入简单的分页 原理很简单,注意一下编码问题就行了 实现了获取评论无刷新,发表评论无刷新,页面获取评论时显示loading加载效果 jquery真的是一个非常优秀的JS库,简单容易掌握,对于网页中的多级菜单、级联效果、Tab...
标签: Web开发
如果你对JQuery的基本语法还不是很熟悉,请搜索本站的教程资源。如果你对PHPMailer用法不熟悉,请查看本站的另一篇文章《使用PHPMailer类库发送电子邮件》。 第一步,创建一个表单HTML页面 这里,我们只展示主要的表单部分HTML结构代码: 代码如下: div id="contact_form" form name="contact" method="post" action="" fieldset la...
标签: Web开发
实际上在用PHP上传文件时。。。只能用$_FILES形式,但是若我们只是单一的用JS方式取其ID,如input id='img' type='file'..document.getElementById('img').value或者jquery形式的$("#img")都是不能正真实际上传的(但是还是有很多人这样做,刚开始时我也是)。 可是功能上又要要求实现所谓的“异步上传”,怎么办呢??只能借助于第三方的组件...
标签: Web开发
网上搜索结合自己开发过程中遇到的情况,整理一下,以备忘: Ajax表单提交数据出现乱码和解决办法    //要传递的参数    var queryString = "firstName=" + firstName + "&lastName=" + lastName                   &nb...

经验教程

868

收藏

71
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部