首页
编程
PHP基础
PHP教程
php框架
JavaScript
asp.net
AJAX
正则表达式
ASP
html代码
css
前端框架
Python
服务器
数据库
mysql
mssql
redis
数据库问题
系统教程
window10教程
window8教程
window11教程
window7教程
windowxp教程
linux教程
U盘教程
操作系统
Windowsxp
windows7
windows8
windows10
其他操作系统
程序下载
企业程序
小说/有声
网站模板
第三方软件
新闻资讯
第三方源码
小程序
商城源码
框架书籍
前端开发
服务器端开发
数据库
开发软件
其他手册
jquery插件库
输入
banner图
图片脚本
导航/分类
播放器
css3
jQuery脚本
jqueryhtml5
进度条
贴图/客服
在线工具
编码转换工具
在线IDE编码工具
开发手册
linux命令大全
Bootstrap
HTML参考手册
css手册/教程
ThinkPHP5.0
ThinkPHP3.2
当前位置：
Gxlcms
>
PHP教程
>
form表单伪Ajax提交
form表单伪Ajax提交
时间：2021-07-01 10:21:17
帮助过：7人阅读
有时候，你可能有这样的需求，就是提交表单的时候，不想刷新本页面。但你又不想用Ajax，有什么方法呢？这时可以在页面中用
和
实现。原理大概是这样实现的。</p><p> <img src="https://img.gxlcms.com//Uploads-s/new/2019-09-22-201922/1478582298579392.png" title="1478582298579392.png" alt="8fdec549-afbf-3863-8a7c-1f5969b48250.png"/></p><p>大家注意到这个form的target的了么？这个target属性的值frameFile,是form之后的iframe的name值,这样的写法是让当前的form表单在提交表单内容的时候转交给iframe中进行页面中表单处理，<br/>并且不会产生当前页面跳转!</p><p> <img src="https://img.gxlcms.com//Uploads-s/new/2019-09-22-201922/1478582315754508.png" title="1478582315754508.png" alt="79d2328e-9169-3bbf-91a0-aff0f80399e7.png"/></p><p> 这个iframe拿到post过来的表单数据后会开始在自身内部访问post过来的页面地址,在内部中它会刷新页面，但是这已不重要了，因为当前的iframe已经被我display:none隐藏了！所以这样给用户看起来像是无刷新的页面，其实只是做一个一个小小的技巧！ </p><p>现在的问题是你可能要在提交成功后给用户一个友好的提示，该怎么做到呢？</p><p>这是你可以先在页面中格式好一段HTML提示，然后把它隐藏起来，像下面这样子</p><p> <img src="https://img.gxlcms.com//Uploads-s/new/2019-09-22-201922/1478582321138910.png" title="1478582321138910.png" alt="0dd8dca4-2c29-37ef-b158-a8ecff5b0661.png"/></p><p>然后在服务器端PHP后台这样处理</p><pre class="brush:php;toolbar:false"><?php header('Content-Type: text/html; charset=utf-8'); $html_str = ''; exit($html_str); ?></pre><p>由于提交到 iframe 窗口中，所以在代码必须用 window 的 parent 属性才能访问到父窗口。</p><p>那种文件伪Ajax上传的方式就是这样实现的。因为Ajax不支持文件上传，所以不想刷新本页面，这种方法非常有用。 </div> <div class=""> <ul class="m-news-opt fix"> <li class="opt-item"> <a href='/PHPjiqiao-189736.html' target='_blank'><p>< 上一篇</p><p class="ellipsis">输出缩略图地址</p></a> </li> <li class="opt-item ta-r"> <a href='/PHPjiqiao-189738.html' target='_blank'><p>下一篇 ></p><p class="ellipsis">PHP编译选项--with和--enable的说明</p></a> </li> </ul> </div> </div> </div> <div class="g-title fix"> <h2 class="title-txt">人气教程排行</h2> </div> <div class="m-rank u-dashed mb40"> <ul> <li class="rank-item"> <a href="/PHPjiqiao-379253.html" title='php如何获取跳转前的url' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num top">1</span> php如何获取跳转前的url </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-379019.html" title='php格林威治时间转换成当前时间的方法' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num second">2</span> php格林威治时间转换成当前时间的方法 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-366629.html" title='为什么php不能做大型系统？' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num third">3</span> 为什么php不能做大型系统？ </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-207623.html" title='range函数怎么用' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">4</span> range函数怎么用 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-162433.html" title='php中计算页面加载时间几种方法总结_PHP教程' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">5</span> php中计算页面加载时间几种方法总结_PHP教程 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-140221.html" title='求帮助，关于paypal支付返回值修改订单状态' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">6</span> 求帮助，关于paypal支付返回值修改订单状态 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-103588.html" title='typecho怎么配置文章内容页?' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">7</span> typecho怎么配置文章内容页? </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-99213.html" title='PhpStorm左侧structure不显示文件的方法列表是这么回事？' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">8</span> PhpStorm左侧structure不显示文件的方法列表是这么回事？ </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-92208.html" title='查看PHP的环境变量_PHP' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">9</span> 查看PHP的环境变量_PHP </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-170.html" title='PHP Primary script unknown 解决方法总结' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">10</span> PHP Primary script unknown 解决方法总结 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-148.html" title='php的命名空间与自动加载实现方法' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">11</span> php的命名空间与自动加载实现方法 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-133.html" title='解决laravel 出现ajax请求419(unknown status)的问题' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">174次</span> <span class="g-sort-num ">12</span> 解决laravel 出现ajax请求419(unknown status)的问题 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-462817.html" title='php 如何删除mysql记录' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">173次</span> <span class="g-sort-num ">13</span> php 如何删除mysql记录 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-388448.html" title='PHP如何替换数组中的指定元素' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">173次</span> <span class="g-sort-num ">14</span> PHP如何替换数组中的指定元素 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-124270.html" title='怎么去除字符串中非汉字、非字母、非数字的字符' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">173次</span> <span class="g-sort-num ">15</span> 怎么去除字符串中非汉字、非字母、非数字的字符 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-112291.html" title='mysql如何一次执行多条SQL语句' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">173次</span> <span class="g-sort-num ">16</span> mysql如何一次执行多条SQL语句 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-110669.html" title='修改header里面的Connection为close解决方法' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">173次</span> <span class="g-sort-num ">17</span> 修改header里面的Connection为close解决方法 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-153.html" title='PHP基于session.upload_progress 实现文件上传进度显示功能详解' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">173次</span> <span class="g-sort-num ">18</span> PHP基于session.upload_progress 实现文件上传进度显示功能详解 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-125.html" title='php5.6.x到php7.0.x特性小结' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">173次</span> <span class="g-sort-num ">19</span> php5.6.x到php7.0.x特性小结 </a> </li> <li class="rank-item"> <a href="/PHPjiqiao-378118.html" title='php为什么会出现504错误' class="item-name ellipsis" target="_blank"> <span class="g-art-count fr">172次</span> <span class="g-sort-num ">20</span> php为什么会出现504错误 </a> </li> </ul> </div> </div> </div> <!-- / 教程内容页 --> </div> </div> <!-- 页尾 --> <div class="footer"> 本站所有资源全部来源于网络，若本站发布的内容侵害到您的隐私或者利益，请联系我们删除！</div> <!-- / 页尾 --> <script type="text/javascript" src="/kan/js/read.js"></script> <div style="display:none"> <div class="login-box" id="login-dialog"> <div class="login-top"><a class="current" rel="nofollow" id="login1" onclick="setTab('login',1,2);" >登录</a></div> <div class="login-form" id="nav-signin"> <!-- <div class="login-ico"><a rel="nofollow" class="qq" id="qqlogin" target="_blank" href="/user-center-qqlogin.html"> QQ </a></div> --> <div class="login-box-form" id="con_login_1"> <form id="loginform" action="/user-center-login.html" method="post" onsubmit="return false;"> <p class="int-text"> <input class="email" id="username" name="username" type="text" value="用户名或Email" onfocus="if(this.value=='用户名或Email'){this.value='';}" onblur="if(this.value==''){this.value='用户名或Email';};" ></p> <p class="int-text"> <input class="password1" type="password" id="password" name="password" value="******" onBlur="if(this.value=='') this.value='******';" onFocus="if(this.value=='******') this.value='';" > </p> <p class="int-info"> <label class="ui-label"> </label> <label for="agreement" class="ui-label-checkbox"> <input type="checkbox" value="" name="cookietime" id="cookietime" checked="checked" value="2592000"> <input type="hidden" name="notforward" id="notforward" value="1"> <input type="hidden" name="dosubmit" id="dosubmit" value="1">记住我的登录 </label> <a rel="nofollow" class="aright" href="/user-center-forgetpwd.html" target="_blank"> 忘记密码？ </a></p> <p class="int-btn"><a rel="nofollow" id="loginbt" class="loginbtn"><span>登录</span></a></p> </form> </div> <form id="regform" action="/user-center-reg.html" method="post"> <div class="login-reg" style="display: none;" id="con_login_2"> <input type="hidden" name="t" id="t"/> <p class="int-text"> <input id="email" name="email" type="text" value="Email" onfocus="if(this.value=='Email'){this.value='';}" onblur="if(this.value==''){this.value='Email';};"></p> <p class="int-text"> <input id="uname" name="username" type="text" value="用户名或昵称" onfocus="if(this.value=='用户名或昵称'){this.value='';}" onblur="if(this.value==''){this.value='用户名或昵称';};"></p> <p class="int-text"> <input type="password" id="pwd" name="password" value="******" onBlur="if(this.value=='') this.value='******';" onFocus="if(this.value=='******') this.value='';"> </p> <p class="int-text1"><span class="inputbox"> <input id="validate" name="validate" type="text" value="验证码" onfocus="if(this.value=='验证码'){this.value='';}" onblur="if(this.value==''){this.value='验证码';};"> </span><span class="yzm-img"><img src="/user-checkcode-index" alt="看不清楚换一张" id="indexlogin"></p> <p class="int-info"> <label> <input value="" name="agreement" id="agreement" CHECKED="checked" type="checkbox"> 我已阅读<a rel="nofollow" href="/user-center-agreement.html">用户协议</a>及<a rel="nofollow" href="/user-center-agreement.html">版权声明</a></label> </p> <p class="int-btn"><input type="hidden" name="dosubmit"/> <a rel="nofollow" class="loginbtn" id="register"><span>注册</span></a></p> </div> </form> </div> </div> </div> </div> <script type="text/javascript" src="/kan/js/foot_js.js"></script> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?6dc1c3c5281cf70f49bc0bc860ec24f2"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script type="text/javascript" src="/layui/layui.js"></script> <script> layui.use('code', function() { layui.code({ elem: 'pre', //默认值为.layui-code about: false, skin: 'notepad', title: 'php怎么实现数据库验证跳转代码块', encode: true //是否转义html标签。默认不开启 }); }); </script> </body> </html>
