iframe式ajax调用示例

1.新建 a.html


<!doctype html>
<html>
<head>
<meta charset=‘utf-8‘>
<title>iframe式ajax调用</title>
</head>
<body>
<form action=‘b.php‘ method=‘post‘ name=‘‘ id=‘‘ target=‘formTarget‘>
<input type=‘text‘ name=‘username‘ id=‘‘ placeholder=‘‘ value=‘‘ />
<input type=‘submit‘ name=‘‘ value=‘提交‘ />
<span id=‘msg‘></span>
</form>
<iframe src=‘‘ name=‘formTarget‘ id=‘formTarget‘ style=‘display:none‘></iframe>
</body>
</html>

2.新建 b.php


<?php
echo "
<script>
parent.document.getElementById(‘msg‘).innerHTML = ‘iframe式ajax调用成功!‘;
alert(‘您输入的是:{$_POST[‘username‘]}‘);
window.setTimeout(function(){
parent.window.location.reload();
},3000);
</script>

3.访问:
http://localhost/a.html 

效果如图 

时间: 2024-08-10 00:04:48

iframe式ajax调用示例的相关文章

jQuery简单的Ajax调用示例

jQuery简单的Ajax调用示例 jQuery确实方便,下面做个简单的Ajax调用: 建立一个简单的html文件: <!DOCTYPE HTML> <html> <head> <script type="text/javascript" src="Public/js/jquery-easyui-1.3.1/jquery-1.8.2.min.js"></script> <script type=&qu

php+jquery+ajax简单Ajax调用示例 (转)

HTML页面 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js">

IFrame和Ajax比较

说到比较,可能我是需要把这连个东西都给大家介绍一下的,但是介于大家都已经有了很多的理解.我就简单的说了. Ajax: 是指一种创建交互式网页应用的网页开发技术.主要是利用XmlHttpRequest对象.该对象在 Internet Explorer 5 中首次引入,它是一种支持异步请求的技术.简而言之,XmlHttpRequest 使您可以使用 JavaScript 向服务器提出请求并处理响应,而不阻塞用户. IFrame: HTML标签,作用是文档中的文档,或者浮动的框架(FRAME). 以上

使用HBuilder开发移动APP:ajax调用接口数据

既然要做APP,与接口交互式少不了的,除非只是想做一个纯静态的APP.所以html5+的环境准备好后,我最先开始研究的就是如何与接口交互. 使用HBuilder新建示例教程后,里面会有一个ajax(网络请求)的列子,文件目录是examples/ajax.html.看了下这个文件的代 码,它的功能就是点击“提交”按钮后提交参数给接口,然后根据选择的返回数据格式,将一段字符串打印出来.我准备改造下这段代码,改由页面加载时调用列表 接口,并在APP里显示这段列表,毕竟这种情况应该经常会用到. 1.在l

Asp.net中ajax调用后台方法

这个当然不用说大家都知道的一种就是ajax调后台的方法.1.有参数的方法调用示例代码如下:前台jQuery代码:$(function() {  这个当然不用说大家都知道的一种就是ajax调后台的方法. 1.有参数的方法调用 示例代码如下: 前台jQuery代码: $(function() {   var browers = browersEstimate();   var params = '{browersType:"' + browers + '"}';   $.ajax({   

Asp.net中JQuery、ajax调用后台方法总结

通过上一篇文章实例的实现,整个过程当中学习到很多知识点,了解了Jquery.Ajax在asp.net中的运用,加以总结,其实原理都是一样的,理解了一种,其他的注意很少的区别就可以了.灵活运用: 1.有参数的方法调用 示例代码如下:前台jQuery代码:$(function() {  知道的一种就是ajax调后台的方法. 1.有参数的方法调用 示例代码如下: 前台jQuery代码: [plain] view plaincopyprint? <span style="font-size:18p

MVC 下 ajax调用 日期差值计算

背景: 服务项目已有服务期起止时间From-To 现在要根据用户输入的新的起始时间, 和该服务期的原有区间值, 计算出新的服务期截止时间 即 NewServiceToDateTime = NewServiceFromDateTime + ( OldServiceToDateTime - OldServiceFromDateTime) 本示例的效果: 1.日期转换 及 差值计算 2.mvc 下 ajax 调用及赋值 相关代码如下: 后台Controller下Action处理 public Date

asp.net Ajax调用Aspx后台方法

Ajax调用的前提(以aspx文件为例:) 1.首先需要在aspx文件后台中引用using System.Web.Services; 2.需要调用的方法必须是公共的(public).静态的(static):如果不是会提示"500 Internal Server Error 问题",代表找不到method. 3.方法定义需要加入[WebMethod]的声明 4.一般建议由返回类型,最起码可能知道调用成功不成功. 下面是简单的调用示例: 后台方法 [WebMethod] public st

DataTables学习:从最基本的入门静态页面,使用ajax调用Json本地数据源实现前端开发深入学习,根据后台数据接口替换掉本地的json本地数据,以及报错的处理地方,8个例子(显示行附加信息,回调使用api,动态显示和隐藏列...),详细教程

一.DataTables  个人觉得学习一门新的插件或者技术时候,官方文档是最根本的,入门最快的地方,但是有时候看完官方文档,一步步的动手写例子,总会出现各种莫名其妙的错误,需要我们很好的进行研究出错的地方. 官方网站(中文):http://datatables.club/ 官方网站:https://www.datatables.net/  二.简单的例子 怎样简单地使用DataTables?使用下方简单的几行代码,一个方法初始化table. $(document).ready(function