iframe无刷新提交表单，iframe仿ajax提交表单
yuyutoo 2024-10-24 17:48 11 浏览 0 评论
使用ajax可以实现无刷新提交表单，但有人表示ajax的效率不行，或者是其他缺点，例如客户端臃肿，太多客户段代码造成开发上的成本，如果网速慢，则会出现ajax请求缓慢，页面空白的情况，对客户的体验不好。ajax请求不利于搜索引擎优化，一般搜不到ajax添加到页面的信息。
这次就介绍一下iframe仿造ajax异步请求，实际上iframe是同步请求，只是把提交的跳转，发生在iframe的可视区域内。
代码
index.html
<!DOCTYPE html>
<html>
<head>
<title>iframe提交表单</title>
<meta charset="utf-8">
<style type="text/css">
#result{
border: none; /*去掉默认的边框*/
width: 300px; /*可视区域的宽度*/
height: 60px; /*可视区域的高度*/
}
</style>
</head>
<body>
<!-- 表单 -->
<h1>iframe提交表单</h1>
<form action="check.php" method="post" target='result'>
<input type="text" class="input_css" name="user" placeholder="请输入账号"><br/>
<input type="password" class="input_css" name="pwd" placeholder="请输入密码"><br/>
<input type="submit" class="formbtn" value="登陆"><br/>
</form>
<!-- 用于查看提交结果 -->
<iframe name='result' id="result" scrolling="no"></iframe>
</body>
</html>check.php
<style type="text/css">
*{
margin:0;
padding:0;
}
</style>
<?php
// 设置编码
header("Content-type:text/html;charset=utf-8");
// 获得POST过来的登陆所需参数
$user = $_POST["user"];
$pwd = $_POST["pwd"];
// 过滤参数
if ($user == '' && $pwd == '') {
echo "<p style='color:#f00;font-size:15px;margin-top:10px;'>账号和密码不得为空</p>";
}else if ($user == '' ) {
echo "<p style='color:#f00;font-size:15px;margin-top:10px;'>账号不得为空</p>";
}else if ($pwd == '' ) {
echo "<p style='color:#f00;font-size:15px;margin-top:10px;'>密码不得为空</p>";
}else{
echo "<p style='color:#000;font-size:15px;margin-top:10px;'>你提交的账号是：".$user."<br/>你提交的密码是：".$pwd."</p>";
}
?>动图演示
相关推荐
- WMS系统设计拆解-入库管理1（wms入库作业流程图）
-
入库业务是仓储管理系统（WMS）中最基础、最关键的环节之一，直接影响到库存准确性、作业效率以及后续的出库和库内操作。作为仓储产品经理，深入理解入库业务的复杂性并设计出高效、灵活的解决方案，是提升仓储整...
- WMS系统的序列号管理（smart cover序列号）
-
在现代物流和仓储管理中，序列号管理扮演着至关重要的角色。它不仅帮助企业追踪商品流转，还能有效防止盗窃和伪造。然而，许多企业在实施序列号管理时常常面临各种挑战。本文将详细介绍在WMS（仓库管理系统）中，...
- 什么是系统管理?#企业管理（系统管理主要包括哪些内容?）
-
什么是系统管理？邱奕玮，营利增长地图顾问。我们老说要搭建管理系统，搭建管理体系到底什么是管理系统？很多时候老板其实概念是很模管理，给员工说你要做流程，员工就做一套流程文件，然后又说要做绩效考，员工又做...
- 公务员管理系统（公务员管理系统hzb怎么导出）
-
公务员管理系统headerfooter...
- 物流管理系统（比亚迪物流管理系统）
-
以管理员身份登录，进入系统业绩管理页面。1、创建界面后，继续完成相关操作。2、根据业绩管理模块的指引进行软件操作。3、更多模块请参见哲程CRM客户管理软件物流版官方操作手册。(9744083)...
- 更多驱动适配 + 跨平台共享，deepin深度操作系统打印管理升级
-
IT之家4月8日消息，深度操作系统今日发文宣布：为了解决打印机驱动的兼容性问题，deepin正式推出全新驱动下载平台，并升级了打印管理器，重点扩展驱动覆盖范围、优化跨平台兼容性、并深度支持...
- ERP系统功能拆解——生产管理是什么?怎么用?
-
本文深入探讨了ERP系统中的生产管理功能，揭示了如何通过高效的计划和控制来优化生产过程。从生产工单的制定到生产入库，每一个环节都被详细拆解，展示了简道云ERP管理系统如何实现流程自动化和数据跟踪。这是...
- 如何在NetBeans IDE中写出更好的Javadoc
-
作为一名在IDR解决方案上的开发者，我花了我很多时间来增加Javadoc中JPedal的JavaPDF库，使之更易于使用。我认为这可能是非常有用的，显示你的NetBeansIDE中如何简化这个过程...
- 6个最佳的Netbeans扩展插件（netbeans gui）
-
作为一个IDR解决方案的开发者，我花费大量的时间了解NetBeans的PDF查看器和NetBeans插件。下面跟大家分享一下哪些插件是比较值得安装的。下面是我认为比较有趣并值得安装的6个NetBean...
- HTTP404...前端必知，精辟简介（前端设置https）
-
1、介绍HTTP，超文本传输协议，是互联网中最为常用的一种网络协议。2、组成HTTP协议有HTTP请求和HTTP响应组成。...
- 会计人的 Python 速成指南:20 个常用代码块解析
-
--【AI会计革命：从账房先生到数据军师的跨界突围】【能力重构篇】泰山医院岳涛引言在数字化浪潮的冲击下，会计行业正经历着深刻变革。传统的账房先生式工作模式逐渐被智能化、自动化的流程所取代。对于会...
- EasyExcel导出Excel表格到浏览器，通过Postman测试导出Excel
-
一、前言小编最近接到一个导出Excel的需求，需求还是很简单的，只需要把表格展示的信息导出成Excel就可以了，也没有复杂的合并列什么的。...
- 用 Superb AI Suite 和 NVIDIA TAO Toolkit 创建高质量的计算机视觉应用
-
数据标记和模型训练一直被认为是团队在构建AI或机器学习基础设施时所面临的最大挑战。两者都是机器学习应用开发过程中的重要步骤，如果执行不当就会导致结果不准确和性能下降。...
- 二 计算机网络 前端学习 物理层 链路层 网络层 传输层 应用层 HTTP
-
一、基础概念请求和响应报文客户端发送一个请求报文给服务器，服务器根据请求报文中的信息进行处理，并将处理结果放入相应报文中返回给客户端。...
欢迎 你 发表评论:
- 一周热门
-
-
前端面试:iframe 的优缺点? iframe有那些缺点
-
带斜线的表头制作好了，如何填充内容?这几种方法你更喜欢哪个?
-
漫学笔记之PHP.ini常用的配置信息
-
其实模版网站在开发工作中很重要，推荐几个参考站给大家
-
推荐7个模板代码和其他游戏源码下载的网址
-
[干货] JAVA - JVM - 2 内存两分 [干货]+java+-+jvm+-+2+内存两分吗
-
正在学习使用python搭建自动化测试框架?这个系统包你可能会用到
-
织梦(Dedecms)建站教程 织梦建站详细步骤
-
【开源分享】2024PHP在线客服系统源码(搭建教程+终身使用)
-
2024PHP在线客服系统源码+完全开源 带详细搭建教程
-
- 最近发表
- 标签列表
-
- mybatis plus (70)
- scheduledtask (71)
- css滚动条 (60)
- java学生成绩管理系统 (59)
- 结构体数组 (69)
- databasemetadata (64)
- javastatic (68)
- jsp实用教程 (53)
- fontawesome (57)
- widget开发 (57)
- vb net教程 (62)
- hibernate 教程 (63)
- case语句 (57)
- svn连接 (74)
- directoryindex (69)
- session timeout (58)
- textbox换行 (67)
- extension_dir (64)
- linearlayout (58)
- vba高级教程 (75)
- iframe用法 (58)
- sqlparameter (59)
- trim函数 (59)
- flex布局 (63)
- contextloaderlistener (56)