大家好.我终于注册成功了.这个论坛我注册了1年终于成功了.
呵呵.可能以前HOTMAIL都白痴的厉害,老是掉邮件.
我只是一个写程序不久的小子.
最近公司的一个UI程序员MM,抱怨AJAX她很不喜欢,还是喜欢过去的IFRAME做法,
我看了她的代码我也很喜欢,共享给一些改造现有程序又不想用AJAX的朋友.
PAGE A:
<script>
var iframeObj = document.getElementById("workFrame");
function changeDiv(){
iframeObj.src="url page b";
}
function changeFrom(){
document.formName.target="workFrame";
document.formName.submit();
}
</script>
<input type="button" name="" value="Change Div" onclick="changeDiv();">
<input type="button" name="" value="Form div" onclick="changeFrom();">
<DIV id="divId">
Main page Content
</DIV>
<Form id="formId" name="formName" action="url page b">
</Form>
<iframe id="workFrame" width="0" height="0" src="">
PAGE B ,iframe result page:
<DIV id="divId">
iframe page result content .
</DIV>
<script>
try{
var div = document.getElementById("divId");
var parent_div = parent.document.getElementById("divId");
if(div){
parent_div.innerHTML = div.innerHTML;
}
}catch(e){
alert(e);
}
</script>
上面的代码应该还比较容易理解吧.我觉得这种方法很简单,虽然和AJAX一样不太直观,但是在我现在的工作中我觉得这是最容易上手的.并且在改造现有代码,算比较好的一种方式.现在老外也开始流行不刷页面的操作了.
当然页面的效果很多,写SCRIPT是少不了的.但是我还是讨厌SCRIPT,因为没有象ECLIPSE 那样好的重构工具.反正SCRIPT给我带来的麻烦太多了.
希望有人习惯.
我的处女贴啊.
分享到:
相关推荐
### 使用隐藏的Iframe实现Ajax无刷新上传 在Web开发中,实现文件的无刷新上传是一种常见的需求。本文将详细介绍如何通过使用隐藏的Iframe来实现这一功能,并结合所提供的代码片段进行具体分析。 #### 一、原理概述...
以下是使用IFrame实现AJAX文件上传的基本步骤: 1. 创建一个隐藏的IFrame元素: ```html <iframe id="upload-iframe" name="upload-iframe" style="display:none;"></iframe> ``` 2. 在表单中设置`target`属性...
在Bootstrap中,可以使用Tab组件轻松实现这一功能。每个选项卡对应一个`iframe`,用户点击选项卡时,对应的`iframe`会显示其内容,同时可以实现窗口的自由关闭、打开,以及关闭其他或全部关闭的操作,这在管理多个...
总之,这个案例展示了如何利用AdminLTE和Bootstrap的强大功能,结合JavaScript和iframe实现局部刷新,这对于提升Web应用的交互性和性能至关重要。通过学习和实践这个案例,开发者能够更好地掌握现代Web开发中的关键...
"iframe实现左侧菜单右侧页面简单示例"就是一个典型的双栏布局模式,常用于展示左侧导航菜单,右侧则展示对应的内容区域。这种设计模式在很多网站和管理系统中都很常见。 Iframe,全称"Inline Frame",是HTML中的一...
我们用`index`变量记录当前页面的位置,并使用模运算符实现循环切换。`#switchBtn`是切换按钮的ID,你可以根据实际需求更改或添加其他触发事件。 为了提高用户体验,我们还可以添加一些过渡效果,比如淡入淡出。这...
传统上,iframe是实现这一功能的常用方法之一。然而,由于iframe存在一些局限性,比如不利于SEO优化、在响应式设计中的兼容性问题等,开发者们开始寻找更好的替代方案。jQuery和ajax技术的结合,提供了一种更为高效...
本文将深入探讨Ajax与iframe的交互,以及如何利用它们来实现特定的功能,特别是针对描述中提到的“target”问题。 首先,让我们了解Ajax的基本概念。Ajax是一种在不重新加载整个网页的情况下,能够更新部分网页的...
"ckeditor 自己写的一个简单的image上传js 运用iframe的ajax上传"是一个关于CKEditor自定义插件的实践案例,通过JavaScript实现了图片上传功能。下面将详细阐述这一知识点及其相关技术。 首先,CKEditor是一款开源...
以下是使用AJAX和iframe实现文件上传的基本步骤: 1. **创建隐藏的iframe**:在HTML页面中创建一个隐藏的iframe元素,设置其`name`属性,例如`iframeUploader`。这个iframe将成为文件提交的目标。 ```html <iframe...
**标题解析:** "iframe ajax前端框架" 指的是一种在前端开发中结合了`iframe`和`AJAX`技术的框架。`iframe`(Inline Frame)是HTML中的一个元素,可以用来在一个网页中嵌入另一个网页,常用于实现页面部分刷新或...
下面详细介绍如何使用 JSP 和 iframe 结合 AJAX 来实现文件上传功能: ### 实现细节 #### 前端 HTML 表单设计 为了实现文件上传功能,我们需要构建一个 HTML 表单,并指定一些关键属性: ```html 上传文件"/...
总之,实现Ajax上传文件并兼容各种浏览器是一项技术挑战,但通过合理使用HTML5新特性、旧版IE的特有对象以及适当的兼容性检查,我们可以构建出一个高效且跨浏览器的文件上传系统。无论用户使用的是现代浏览器还是老...
这篇文章将详细讲解如何使用iframe来实现Ajax文件上传的效果。 首先,我们来看JavaScript部分。在示例代码中,我们通过监听表单的`onsubmit`事件来处理文件上传。当用户点击提交按钮时,会触发这个事件。我们创建了...
在Vue.js中实现嵌套页面通常涉及到使用`iframe`元素来加载外部网页或者内部组件。`iframe`允许我们在一个Vue应用中嵌入另一个独立的HTML文档,这对于展示第三方内容、实现某些特定功能或者处理复杂交互场景时非常...
"iframe实现页面跳转"这个话题涉及到如何利用iframe来实现在不刷新整个页面的情况下,动态加载不同的网页内容,从而提供更好的用户体验。 首先,iframe的使用方式是在HTML代码中插入`<iframe>`标签,指定其`src`...
常见的实现方式包括使用iframe框架形式、Ajax功能以及结合Flash技术。 ### 异步文件上传的实现方式 #### 使用iframe框架形式 iframe技术允许在一个页面内嵌套另一个独立的页面,因此可以利用iframe创建一个独立的...
4. 对于SEO,可以考虑使用`AJAX`或`PWA`等技术替代`iframe`。 总结,`iframe`在网页设计中扮演着重要角色,尤其在实现部分网页刷新功能时。然而,我们也应关注其潜在的问题,并根据实际需求和场景合理使用。在开发...