首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js – form表单提交不刷新

大家已经发现了, 当我们点击submit提交form表单的时候, 他会刷新一次, 如果不想它刷新的话有下面两种方法: 利用iframe 我们可以利用一个隐藏的iframe来实现, 主要是我们把提交目标放到一个隐藏的...iframe里, 然后让iframe提交数据 (ps: 这个未实测, 仅仅是网上提供的, 我记录一下...., 然后我们return false(让submit这次的点击触发事件失效, 否则表单又会提交一次, 并且刷新页面) 我们可以这样: ====== 如果你用原生js的话 html代码: js代码: function post_data(){ // ajax数据提交代码 // ........我们在绑定onsubmit的时候是把return false放进onsubmit后面的调用函数内的, 这样子如果你的函数出现了错误, 将不会继续执行到函数最后’return false’这里, 还是会出现刷新的现象

14.5K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    解决 php提交表单到当前页面,刷新会重复提交 的问题

    解决 php提交表单到当前页面,刷新会重复提交 今天在写php程序的时候,发现一个问题,就是post提交到本页的表单数据,刷新后会反复提交。因此向群友请教。最终,得到了解决。...如下: 只需要在表单里生成一个token(随机字符串),然后用个input装起来,设置hidden。...第一次post处理完数据后把token存入session,接下来每次post判断一下token跟session中的一不一样,一样则说明数据处理过了。 然后给出一段代码 示例 <?...不同则进行处理 if($session_id == $post_id){ echo "已经处理过了,不管了"; }else{ //如果页面还没有提交过表单...,则显示表单,否则处理post过来的数据 if($post_id == -2){ ?

    2.2K40

    WordPress的主题添加AJAX无刷新提交评论功能

    有时主题在提交评论后会刷新整个网页才可获取资源,别人家的都不是这样的,以下可以改善评论后无刷新即可获取资源。 在function.php文件加入以下代码 get_option('comment_order'),             'formpostion' => 'bottom', //默认为bottom,如果你的表单在顶部则设置为...ajax_comment",             type: jQuery(this).attr('method'),             beforeSend: faAjax.createButterbar("提交中...// your comments wrapper                     }                 }                 t.createButterbar("提交成功...将文件夹Ajax的评论放在主题根目录。 其中布局需要根据自身主题进行微调。

    1.7K40

    Vue组件案例-评论列表

    编写这个案例步骤大致如下: 编写一个基本的样式页面,页面内容有两部分:提交评论信息表单、展示评论信息的列表 那么提交评论信息表单可以写为一个子组件,而评论信息列表为父组件 给提交评论信息表单将子组件的评论内容传递到父组件评论信息列表...同时,需要写一个存储以及刷新评论信息列表的方法,在子组件提交评论信息之后,子组件还要调用父组件的这个刷新方法。...7.存储评论内容数据完毕后,清空输入框 ? 好了,这时候已经设置添加好评论内容的数据。下面来看看如何在列表中刷新数据。...8.在父组件编写刷新列表的方法reload_list(),提供子组件进行调用 ? ? 在浏览器点击提交按钮,查看是否触发父组件的reload_list方法,如下: ?...已经成功可以添加评论以及刷新列表数据了。

    2.1K30

    Vue组件案例-评论列表

    编写这个案例步骤大致如下: 编写一个基本的样式页面,页面内容有两部分:提交评论信息表单、展示评论信息的列表 那么「提交评论信息表单」可以写为一个子组件,而「评论信息列表」为父组件 给「提交评论信息表单」...将子组件的评论内容传递到父组件「评论信息列表」 同时,需要写一个存储以及刷新评论信息列表的方法,在子组件提交评论信息之后,子组件还要调用父组件的这个刷新方法。...下面来看看如何在列表中刷新数据。...8.在父组件编写刷新列表的方法reload_list(),提供子组件进行调用 在浏览器点击提交按钮,查看是否触发父组件的reload_list方法,如下: 好了,到这里可以执行父组件的刷新列表方法了...,那么下面只要完善刷新列表的方法,对数据进行刷新即可。

    1.9K10

    【jquery Ajax 】form表单教学+评论案例

    什么是表单的同步提交                 表单提交的缺点 通过Ajax提交表单数据         监听表单提交事件         快速获取表单中的数据                 serialize...()函数 案例——评论列表         渲染UI结构          获取评论数据                 文档 请求的根路径 评论列表                 代码             ...当表单未指定action属性值的情况下,action的默认值为当前页面的URL地址。 当表单提交后,页面会跳转到action属性指向的地址。                ...表单提交的缺点 表单同步提交后,整个页面会发生跳转,跳转到action URL所指向的地址,用户体验很差。 表单同步提交后,页面之前的状态和数据会丢失。...String 对 status 字段的详细说明 data Array 评论列表 +id Number 评论Id +username String 评论人姓名 +content String 评论内容

    2.2K20
    领券