`
wangchangtao
  • 浏览: 18819 次
  • 性别: Icon_minigender_1
  • 来自: 石家庄
社区版块
存档分类
最新评论

ajax方式提交form

    博客分类:
  • ajax
阅读更多
思路:
1.创建一个iframe
  if(window.ActiveXObject)
  {
       var io = document.createElement('<iframe id="' + frameId  + '" name="' + frameId + '" />');
      if(typeof uri== 'boolean'){
         io.src = 'javascript:false';
      }
      else if(typeof uri== 'string'){
         io.src = uri;
      }
  }
  else
  {
     var io = document.createElement('iframe');
     io.id = frameId;
     io.name = frameId;
  }
  io.style.position = 'absolute';
  io.style.top = '-1000px';
  io.style.left = '-1000px';
  document.body.appendChild(io);
2.将form的target设置为步骤1创建的iframe
3.为步骤1的iframe注册事件
  if(window.attachEvent)
  {
     document.getElementById(frameId).attachEvent('onload',       uploadCallback);
  }
  else
  {
     document.getElementById(frameId).addEventListener('load', uploadCallback, false);
  }
4.获得返回的数据
  var uploadCallback = function()
   { 
      var io = document.getElementById(frameId);
      try {   
    if(io.contentWindow)
    {
xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null;
xml.responseXML = io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document;
     
    }
         else if(io.contentDocument)
{
   xml.responseText = io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null;
   xml.responseXML = io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document;
}     
       }catch(e){}
5.根据不同的返回类型分别对返回的数据进行处理
分享到:
评论

相关推荐

    ajax方式提交表单,全局提交

    "ajax方式提交表单,全局提交"这个主题涉及到的是如何利用AJAX来实现表单数据的异步提交,从而避免页面刷新,提高用户交互性。 AJAX表单提交的核心在于使用JavaScript库,比如jQuery,来处理表单的提交事件。在提供...

    ajax提交form表单和上传图片

    本教程将详细讲解如何利用jQuery、jQuery Form插件以及Spring MVC框架来实现Ajax提交表单并上传图片。通过这种方式,用户无需等待页面刷新,即可完成操作,提升了交互性。 首先,`jquery.js` 是jQuery库的核心文件...

    ajax提交form表单

    1. **安全性**:使用Ajax提交表单时需要注意安全问题,如CSRF攻击,确保请求是来自合法的来源。 2. **用户体验**:虽然同步请求可以立即得到结果,但会阻塞UI,降低用户体验。推荐使用异步请求。 3. **错误处理**:...

    ajax提交表单到后台

    3. **使用AJAX提交表单**:在JavaScript中监听表单的提交事件,使用`$.ajax`方法进行异步提交: ```javascript $('#myForm').on('submit', function(event) { event.preventDefault(); // 阻止默认的表单提交行为...

    jq ajax提交表单

    完整的jq ajax提交表单,奖解压后jq文档加入页面中,调用就可惟了。 表单结构 &lt;form id="myForm" action="comment.php" method="post"&gt; Name: &lt;input type="text" name="name" /&gt; Comment: &lt;...

    ajax异步提交表单

    ### AJAX异步提交表单知识点解析 #### 一、AJAX技术概述 AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,AJAX可以...

    ajaxForm异步提交表单(含图片)

    总的来说,ajaxForm异步提交表单是实现高效、流畅的用户交互的有效方式,特别是当表单包含图片或其他大文件时。通过正确配置和使用,可以极大地提高网站的性能和用户体验。在实际开发中,还需要注意跨域、安全性和...

    ajax验证并提交表单的两种方法博客源码

    本资源通过ajax实现对提交的form表单的验证,该代码不但有针对property验证,也有针对object验证,还有一个异步获取对象的实例;包含完整的代码和库文件;在myeclipse8.5和apache-tomcat-6.0.30测试通过;访问网址:...

    ajax 无刷新实现表单提交

    ajax无刷新表单提交 2;ajax的运行历程 最简单明了的实例,清晰的帮你弄清上述概念,运行简单,只需解压该包,然后Myeclipse中file - import - general - import existed project to workspace,即可调试运行 调试...

    ajax提交表单小例子

    在“ajax提交表单”这个场景中,我们需要关注的是POST请求,因为表单提交通常涉及到向服务器发送数据。以下是使用JavaScript实现的一个简单例子: ```html &lt;!DOCTYPE html&gt; &lt;title&gt;AJAX提交表单示例 &lt;form ...

    jQuery基于Ajax方式提交表单功能示例

    本文实例讲述了jQuery基于Ajax方式提交表单功能。分享给大家供大家参考,具体如下: 提交表单一般通过同步的方式提交,提交后页面刷新或跳转到新页面来显示服务器端返回的处理结果。如果表单提交后有另外的操作或...

    完成的 Ajax 提交表单

    总结来说,本示例的"完成的Ajax提交表单"展示了如何使用Ext JS结合Ajax技术,实现无刷新的表单提交,提高Web应用的响应速度和用户体验。通过理解和实践这些知识点,开发者可以更好地构建交互性更强的Web应用程序。

    非常简单的ajax表单提交

    jQuery.form.js是一个form插件,支持ajax表单提交和ajax文件上传.

    .net+ajax+jquery.form实现简单的图片批量上传源码

    `jQuery.form`插件是jQuery的一个扩展,专门用于处理表单提交,包括使用AJAX方式提交表单。 在描述中提到,使用`jQuery`动态添加表单。这通常涉及到在用户交互后,例如点击按钮,通过JavaScript动态生成HTML表单...

    vue12ajax提交表单

    在本教程中,我们将深入探讨如何在Vue 1.x和2.x版本中使用Ajax提交表单。 **Vue 1.x 和 Vue 2.x 的核心差异** Vue 2.x 对于Vue 1.x进行了一些关键性的改进,包括优化性能、引入虚拟DOM以及对组件API的调整。然而,...

    使用AJAX提交Form表单实例演示

    为了实现AJAX提交,我们需要在页面加载完成后绑定一个事件监听器到表单的提交事件。在`&lt;script&gt;`标签中编写以下jQuery代码: ```javascript $(document).ready(function() { $('#myForm').on('submit', function...

    利用ajax提交表单完整流程

    本文将详细介绍如何利用AJAX提交表单的完整流程,以实现更加流畅和用户友好的交互体验。 ### 1. 创建HTML表单 首先,我们需要创建一个HTML表单,它包含了用户输入的数据和一个用于触发AJAX提交的按钮。例如: ```...

    使用jQuery ajax提交表单代码

    在“使用jQuery ajax提交表单代码”的资源中,我们可以期待看到一个清晰的示例,展示如何将表单数据发送到服务器,并处理响应。 1. **jQuery的$.ajax()函数** - **基本语法**:`$.ajax({ options });` - **选项...

    Asp+ajax提交表单实例

    接下来,我们将深入探讨Asp+Ajax提交表单的实例,以及如何实现这一功能。 首先,我们需要理解Ajax的核心概念。Ajax并非一种编程语言,而是利用JavaScript、XMLHttpRequest对象和DOM(Document Object Model)来实现...

Global site tag (gtag.js) - Google Analytics