您的位置:首页 > Web前端 > JavaScript

javascript构造可以上传文件的form表单(通过js修改enctype)

2019-06-12 16:40 1446 查看

 在上传文件时,我们都知道需要在form表单中加上enctype="multipart/form-data"。而在开发过程中,也有可能遇到需要用javascripts构造form表单的情况。一般javascript构造form,可以使用以下方法:

 

var form = document.createElement('form');

form.id="the_form";

form.action="/img.php";

form.method='post';

form.name="the_form_";

 

  当javascript构造的form,遇到需要上传文件的时候,本以为直接加一句form.enctype="multipart/form-data"就能解决问题,却发现满不是那么回事。从网上搜了一些原因,最终找到解决原因,原来javascript的form的对象名并不应该是enctype,而应该是encding,改为form.encding="multipart/form-data",问题解决。

 

  将表单放到HTML标签中可以使用以下代码:

 

var parNode = document.getElementById("plus");

parNode.appendChild(form);//在plus中增加form表单,plus为html中的一个层

 

  表单中也可以放入input、checkbox等表单,可以使用以下代码,通过表单的对象可以改变表单的类型和值:

 

var input=document.createElement("input");

input.id="upfile_1";

input.name="upfile_1";

input.type="file";

input.className="file_upload";

input.onchange=function (){//点击表单时调用upload_pic()函数

     upload_pic();

}

form.appendChild(input);//在form中追加input表单

最后给你们推荐一个群,如果你还想提升自己,

欢迎加入Java技术交流群:659270626

本群提供免费的学习指导 提供Spring源码、MyBatis、Netty、Redis,Kafka、Mysql、Zookeeper、Tomcat、Docker、Dubbo、Nginx、分布式、高并发、性能调优、等架构技术架构资料 以及免费的解答

不懂的问题都可以在本群提出来 之后还会有职业生涯规划以及面试指导 

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐