.......
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
........
<form id="fabokeForm" method="GET" action="json.asp" accept-charset="GBK" target="hiddenIframe">
..... ......
</form>
<iframe id="hiddenIframe" name="hiddenIframe" width=0 height=0 style="display:none" frameborder=0 src="about:blank"></iframe>
var form = document.getElementById("fabokeForm");
/**/
var iframe = document.getElementById("hiddenIframe");
function iframeOnload(){
var html = "",json = null;
try{
var el = (iframe.contentWindow || iframe.contentDocument.parentWindow).document.body;
while(el && el.nodeType !== 3){
el = el.firstChild;
}
html = el.nodeValue ;
json = html ? eval("(" + html + ")") : false;
}catch(e){}
if(json){
if(json.data && json.data.title){
alert(json.data.title);
}else if (json.error){
alert(json.error || "上传失败。");
}
}
}
if(iframe.attachEvent){
iframe.attachEvent("onload",iframeOnload);
}else{
iframe.onload = iframeOnload;
}
//处理页面编码问题
if(navigator.userAgent.indexOf("MSIE") !== -1){
form.onsubmit = function(e){
document.charset='GBK';
}
window.onbeforeunload = function(){
document.charset='UTF-8';
}
}
分享到:
相关推荐
用iframe提交表单,主要是将表单提交到iframe中,可实现无刷新提交。 html页面: <iframe name="FORMSUBMIT" width="1" height="1" ></iframe> ...
以前在面试的时候经常遇到问关于跨域的事儿,所以自己对跨域有一定的概念性了解,知道什么是跨域以及解决跨域的方法,但是具体实际从来没有操作过,直到最近在公司项目中,遇到了一个需要使iframe跨域进行POST提交的...
创建一个隐藏的iframe,将表单嵌入其中,然后在表单提交事件中指定目标为iframe,这样表单的数据就会被发送到iframe加载的URL。 2. **form表单提交**:在HTML中,可以通过设置`<form>`元素的`target`属性为iframe的...
在Web开发中,异步表单提交是一种常见需求,它能提供更好的用户体验,因为用户无需等待页面刷新即可完成数据的提交。jQuery.form插件正是为了满足这种需求而设计的,它扩展了jQuery库,使表单异步提交变得更加简单、...
如下所示: layer.open({ id: 'LAY_layuipro', //设定一个id,防止重复弹出 ... var inputForm = $(window.frames[layui-layer-iframe + index].document).contents().find(#userForm); inputForm.
2. 创建一个`<form>`元素,设置`enctype="multipart/form-data"`以支持文件上传,`target`属性设置为`iframe`的`name`,确保表单提交到`iframe`。 3. 使用JavaScript监听`<iframe>`的`load`事件,当`iframe`加载完成...
2. **设置iframe的src**:当用户触发提交事件(如点击按钮)时,将`iframe`的`src`属性设置为处理表单提交的服务器端页面URL,并附带任何必要的参数。 3. **绑定事件**:监听`iframe`的`load`事件,当`iframe`加载...
这是jQuery Form Plugin的一个核心文件,它扩展了jQuery,使得我们可以方便地进行异步表单提交。例如,我们可以使用以下代码来实现: ```javascript $("#myForm").submit(function(event) { event.preventDefault...
设置`<form>`的`target`属性为之前创建的`<iframe>`的名称,这样当表单提交时,数据就会发送到`<iframe>`而不是当前页面。同时,确保设置`method`属性为"POST"或"GET",以指定数据提交的方式。以下是一个示例: ```...
**Ajax表单提交插件jQuery Form** 在Web开发中,jQuery Form插件是一个非常实用的工具,它使得使用Ajax技术提交HTML表单变得简单而直观。这个插件扩展了jQuery库,提供了强大的功能,允许开发者无刷新地更新页面...
本文将结合这三个技术点,通过实例讲解如何在PHP表单提交后关闭Layer弹窗中的iframe。 首先,介绍Layer插件的基本使用方法。Layer插件主要通过JavaScript调用,提供了一套API进行弹窗操作。例如,使用layer.open()...
这里定义了一个隐藏的`iframe`元素`frameFile`,它的`name`属性与表单中的`target`属性相匹配,用于接收表单提交后的响应数据。 3. **JavaScript监听与处理**: ```javascript $(function(){ $('#fileUp')....
通过对上述知识点的学习,我们可以更加灵活地利用JavaScript来处理`iframe`中的各种问题,包括但不限于访问、修改`iframe`内部元素、提交表单、调用方法以及触发事件等。这些技巧对于开发复杂的Web应用来说是非常...
2. 设置表单目标:将表单的`target`属性设置为IFRAME的ID,这样表单提交后,内容将在IFRAME内加载。 3. 使用JavaScript处理:通过JavaScript监听表单的提交事件,当表单提交时,可以先通过AJAX提交非文件字段的数据...
当使用iframe作为表单提交的目标时,表单数据实际上是在后台异步提交的,用户无需等待表单提交和页面刷新,从而实现无刷新上传。一旦服务器处理完成,可以通过JavaScript(如回调函数)来处理服务器返回的结果,例如...
本文将详细介绍如何在Vue中解决表单提交但不跳转页面的问题。 首先,我们需要理解Vue中事件绑定的概念。Vue提供了`v-on`指令用于监听和处理DOM事件,例如表单的提交事件。`v-on`可以简写为`@`,所以`v-on:submit`...
这个例子涵盖了layui的`form`和`layer`模块的基本使用,包括按钮事件监听、弹窗创建、表单渲染、表单验证以及表单提交。通过深入学习layui文档,你可以发掘更多高级特性和定制化选项,进一步提升你的前端开发效率。
在使用iframe时,可以利用其天然的提交特性,比如表单提交到iframe中,以避免整个页面刷新。表单的target属性设置为iframe的ID,即可实现在iframe内部提交表单数据。 ```html <!-- form fields --> ``` 这样,...