实现form表单无刷新提交

众所周知,form表单提交是要重定向的,但在有些需求中,是要实现无刷新提交的。
demo如下

<form method="post" enctype="multipart/form-data" class="addFile" target="addfile"
      action="../../../system/crmJcb_AddJcFile.action">
    
</form>

在form表单添加两个属性,一个是enctype,一个是target,然后再添加一个iframe。

<iframe id="addfile_iframe" src="" name="addfile" style="display: none;" frameborder="0"></iframe>

可以看到,form标签的target属性的值是与所要提交到的iframe的name值是相同的,这样就可以实现了。
研究其原理,查了些资料。
w3c是这样描述form的target属性的:



所以我觉得,form表单还是重定向了,只不过这个是作用于iframe框架了

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 本人做php的,最近发现JS真的是博大精深啊,比PHP难.在HTML中,表单是由form元素来表示的,但是在jav...
    linfree阅读 2,261评论 3 17
  • <input>标签 标签用于搜集用户信息,根据不同的type属性值,输入字段拥有很多种形式。输入字段可以是文本字段...
    _空空阅读 4,105评论 0 3
  • 学习HTML的最佳网站没有之一http://www.w3school.com.cn/html/ 关于HTML/HT...
    Amyyy_阅读 2,178评论 0 16
  • form简介 是HTML中的一个元素,它表示文档中的一个区域,这个区域包含了交互控件,用于向web服务器提交信息。...
    七里之境阅读 1,399评论 0 1
  • 终会有那么一天,我开着最惹眼的车,穿着最刺眼高贵的衣服,手捧鲜花单膝下地向你表明我18岁时的心意,我希望那时的你,...
    小巴贱儿阅读 207评论 0 0