如何不用form上传文件?

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>

    <!-- <form method="post" action="" enctype="multipart/form-data">
    <input type="file" id="f2">
    <input type="submit" name="submit">
    </form> -->

   <input type="text">
        <button type="button" class="button white">
                        本地导入
        </button>
    
        <button  type="button">确认</button>

</body>
</html>

点击本地导入按钮 选择文件后 路径显示在input框中?

阅读 7.1k
5 个回答

1.form表单提交
图片描述
注意:
1.如果传输文件,需要设置enctype="multipart/form-data"
2.这种提交方式带来的弊端是会跳转页面

2.ajax方式提交
图片描述
图片描述

首先通过input标签获取到file对象,然后通过HTML5的FormData对象对file等信息进行封装
ajax中需要注意的是里面的参数配置
type:'POST'
contentType:'multipart/form-data'
processData:false//不改变传输数据中的对象

上面的代码还有另一种方式可以实现:
图片描述

备注:avalon中的ajax不支持formdata传输

把input隐藏起来啊
用另一个按钮控制onclick=$(按钮).click()

html5可以不用

俩个动作 分别显示和隐藏input

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题