`
zxbsearch
  • 浏览: 4696 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

iframe无跳转表单提交

阅读更多

       今天开发中需要实现用户注册无刷新跳转。既然是用户注册第一个想要用到的插件是juery formValidator(功能比较强大,效果也比较好),要实现不刷新跳转,那肯定是通过AJAX的方式去提交数据,用到的是jquery.form表单插件。

       在使用的过程中出现了问题,两个插件都是在绑定表单,在表单提交的时候去触发的,如何保证执行的先后顺序,一般的处理是将jquery.from的触发,formValidator的success方法中,也不是按顺序执行的。尝试了各种方式也不行。(有遇到类似问题的,可以提供下看怎么处理的)

       然后放弃jquery.form 改用iframe去实现。

<form id="regform" name="regform" action="/user/register.php" method="post" target="subtarget">
</form>
<iframe id="subtarget" name="subtarget" style="display:none;"></iframe>

在服务端输出验证JS,就OK了。 echo '<script>window.parent.alert("验证码验证失败!")</script>';exit;

 

 

分享到:
评论

相关推荐

    JS页面跳转和js对iframe进行页面跳转、刷新

    在表单提交时,通过设置`target`属性为特定的iframe,可以使表单数据提交到该iframe内,从而实现页面跳转。 ```html &lt;!-- 表单元素 --&gt; ``` #### 4. 使用`window.opener` 当一个新窗口打开时,可以通过`window....

    子窗口iframe跳转到父窗口

    ### 子窗口iframe跳转到父窗口的知识点详解 #### 一、背景介绍 在现代Web开发中,`iframe`(Inline Frame)是一种常见的技术,用于在当前网页中嵌入另一个网页或文档。通过`iframe`,开发者可以实现丰富的功能,如...

    iframe页跳转父窗体

    3. **表单提交**:用户提交表单后,可以通过这种方式跳转到结果页面,提供更好的用户体验。 #### 五、注意事项 1. **安全性问题**:由于涉及跨域访问限制(Same-Origin Policy),在不同域名之间使用这种技术可能...

    vue 解决form表单提交但不跳转页面的问题

    本文将详细介绍如何在Vue中解决表单提交但不跳转页面的问题。 首先,我们需要理解Vue中事件绑定的概念。Vue提供了`v-on`指令用于监听和处理DOM事件,例如表单的提交事件。`v-on`可以简写为`@`,所以`v-on:submit`...

    使用iframe实现提交表单不刷新页面

    设置`&lt;form&gt;`的`target`属性为之前创建的`&lt;iframe&gt;`的名称,这样当表单提交时,数据就会发送到`&lt;iframe&gt;`而不是当前页面。同时,确保设置`method`属性为"POST"或"GET",以指定数据提交的方式。以下是一个示例: ```...

    Form提交表单页面刷新不跳转

    通过这种方式,表单提交时不会引起主页面的跳转,而是仅加载隐藏iframe中的内容。 在实际应用中,这种技术可以用于创建无刷新的数据交互场景,提供更加流畅的用户体验。例如,在Web聊天应用、在线填写表单等场景中...

    jquery异步提交form表单

    在传统的HTML表单提交过程中,页面会跳转到服务器返回的结果页面,这在用户体验上并不理想,特别是在进行数据提交或者文件上传时。jQuery的`$.ajax()`函数或`.submit()`配合`.ajaxSubmit()`方法为我们提供了异步提交...

    Form表单提交刷新页面不跳转源码设计

    在探讨Form表单提交并刷新页面却不进行页面跳转的实现方法时,...此外,虽然iframe技术在实现表单提交不跳转方面有效,但开发者也应当考虑安全因素,比如避免XSS攻击,并确保用户提交的数据能够得到妥善处理和验证。

    js处理iframe的系列问题

    通过对上述知识点的学习,我们可以更加灵活地利用JavaScript来处理`iframe`中的各种问题,包括但不限于访问、修改`iframe`内部元素、提交表单、调用方法以及触发事件等。这些技巧对于开发复杂的Web应用来说是非常...

    基于HTML实现表单提交后不刷新页面

    使用ajax实现表单提交无刷新页面在项目中经常会用到。前一段时间跟着师傅学到了另外几种无刷新提交表单的方法,主要是基于iframe框架实现的。现在整理出来分享给大家。 第一种: (html页面) HTML Code复制内容到...

    php 提交表单 关闭layer弹窗iframe的实例讲解

    本文将结合这三个技术点,通过实例讲解如何在PHP表单提交后关闭Layer弹窗中的iframe。 首先,介绍Layer插件的基本使用方法。Layer插件主要通过JavaScript调用,提供了一套API进行弹窗操作。例如,使用layer.open()...

    基于layui点击按钮弹出包含表单的窗口

    这个例子涵盖了layui的`form`和`layer`模块的基本使用,包括按钮事件监听、弹窗创建、表单渲染、表单验证以及表单提交。通过深入学习layui文档,你可以发掘更多高级特性和定制化选项,进一步提升你的前端开发效率。

    php HTML无刷新提交表单

    通过本文所述的两种无刷新表单提交方式,开发者可以根据实际需要选择使用iframe或Ajax(如果需要更多交互性和灵活性,通常推荐使用Ajax)。需要注意的是,当使用iframe进行表单提交时,由于跨域安全限制,某些场景下...

    Javascript 同时提交多个Web表单的方法

    当表单的target属性被设置为某个iframe的名称时,表单提交的结果就会显示在这个iframe中。使用JavaScript的document.getElementById()方法可以选取页面上特定的表单,并调用submit()方法来提交表单。需要注意的是,...

    Django 在iframe里跳转顶层url的例子

    然而,当用户在iframe内完成特定操作,比如登录成功后,有时我们需要将页面跳转到顶层窗口,而不是继续在iframe内显示。本文将详细介绍如何在Django中实现这个功能。 首先,假设我们有一个名为`login.html`的登录...

    静态页跳转传值、静态页跳转传值

    6. **隐藏表单提交**: - 在一个隐藏的表单中设置需要传递的值,然后通过JavaScript触发表单的提交,目标页面可以通过表单的提交事件获取这些值。这是一种较旧的方法,现在不常用,但它仍然有效。 7. **自定义事件...

    layui-iframe.rar

    在实际应用layadmin时,开发者需要理解layui的模块加载机制,如何配置和引用layui模块,以及如何结合iframe来实现页面间的跳转和数据传递。对于layuiadmin中的iframe,可能涉及到layui的laypage分页组件、form表单...

    关于iframe跨域POST提交的方法示例

    本文重点探讨如何利用iframe进行POST无刷新提交。 在实现iframe跨域POST提交时,我们通常创建一个隐藏的iframe,将表单的提交目标设置为这个iframe。通过这种方式,表单数据会被发送到iframe指向的URL,而不是导致...

    php+js iframe实现上传头像界面无跳转

    首先,前端HTML部分通过创建一个表单(form),并设置其target属性为目标iframe,使得表单提交时不会刷新或跳转到其他页面。表单中包含一个文件输入(input type="file"),供用户选择图片文件,以及一个隐藏的提交...

Global site tag (gtag.js) - Google Analytics