input注册事件来自:https://blog.csdn.net/qq_30100043/article/details/76408184
上传 来自:https://blog.csdn.net/ld767416042/article/details/80135331
1.html
<form id="form1" enctype="multipart/form-data" onchange="filechange">
<input type="file" name="upfile" id="upfile" value="" />
</form>
2.js
2.1.这个事件会在弹出框关闭时触发
document.getElementById('upfile').addEventListener('change', function(data) {
console.log('来了')
console.log(data)
})
2.2.js整体是这样的
document.getElementById('imageFile').addEventListener('change', function(data) {
var formData = new FormData();
formData.append('file', document.getElementById('imageFile').files[0]);
formData.append('type', 'goods'); // 需要什么参数这样加
$.ajax({
type: 'POST',
url: '<?=Url::to(['common/upload-image-web'])?>',
data: formData,
processData: false,
contentType: false,
success: function(data) {
console.log(data)
},
error: function(err) {
console.log(data)
}
})
})
/**多图**/
1.首先要在form加multiple
2.上面的js稍作修改
document.getElementById('imageFile').addEventListener('change', function (data) {
var formData = new FormData();
let files = document.getElementById('imageFile').files;
let len = document.getElementById('imageFile').files.length;
for (let i = 0; i < len; i++) {
formData.append('file', files[i]);
formData.append('type', 'goods');
$.ajax({
type: 'POST',
url: '<?=Url::to(['common/upload-image-web'])?>',
data: formData,
processData: false,
contentType: false,
success: function (data) {
console.log(data)
},
error: function (err) {
console.log(data)
}
})
}
});