javascript - Pourquoi ne puis-je pas télécharger des images sans actualiser en php + ajax?
大家讲道理
大家讲道理 2017-05-24 11:30:56
0
2
527

Écrivez une fonction de téléchargement de fichier relativement faible. Vous devez cliquer sur Télécharger pour le télécharger sur le serveur.
Mais après le test, le téléchargement ne parvient toujours pas. Je ne sais pas ce qui se passe ? Ci-dessous mon code :

html

<body>
    <p class="toolbar1">
        <a href="javascript:;" id="upload" class="a-upload mr10"><input id="changeFile" type="file" name="myFiles" id="">点击这里上传文件</a>
        <p class="showFileName mr10"></p>
        <button id="uploadBtn" type="button" class="btn btn-primary">上传</button>
    </p>
</body>

php:

<?php 
    //做个路由 action为url中的参数
    $action = $_GET['action'];
    switch($action) {
        case 'upload_file':
            upload();
            break;
    }
    
    function upload(){
        // 获取上传的图片
        $pic = $_FILES['myFiles']['tmp_name'];
        $upload_ret = false;
    
        if($pic){
            // 上传的路径,建议写物理路径
           $uploadDir = "../upload_files";
            // 创建文件夹  
            if(!file_exists($uploadDir)){        
                mkdir($uploadDir, 0777);    
            }    
            // 用时间戳来保存图片,防止重复
            $targetFile = $uploadDir . '/' . time() . $_FILES['myFiles']['name'];    
            // 将临时文件 移动到我们指定的路径,返回上传结果
            $upload_ret = move_uploaded_file($pic, $targetFile) ? true : false;
        }
    
        return $upload_ret;
    }
?>

js:

$(function() {
    //上传图片
    $('#uploadBtn').on('click',function(){
        /*alert('444');*/
        uploadFiles();
    })

    function uploadFiles(){
        //上传文件接口
        var uploadUrl = "./php/data.php?action=upload_file";
        //选择的文件
        var files = document.getElementById('changeFile').files[0];
        var fileArr = [files];
        //经过调试是不进ajax的
        $.ajax({
            type:"post",
            url:uploadUrl,
            data:fileArr,
            dataType: 'json',
            contentType: 'application/json;charset=utf-8',
            success: function(data) {
                console.log(data);
            },
            error: function(data){
                        
            }
        });
    }
}

Après le débogage, ajax n'est pas saisi dans js. Je ne sais pas quel est le problème ? S'il vous plaît, aidez-moi, merci !
En php, comment obtenir la valeur de $pic = $_FILES['myFiles']['tmp_name'];$pic ? Lors du débogage, j'ai constaté que cette valeur ne pouvait pas être obtenue. Dans js, je convertis les informations de fichier obtenues en un tableau et les transmets via la publication ajax. Comment transmettre ce tableau à php ?

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

répondre à tous(2)
漂亮男人

Vous transmettez des données mixtes, essayez de changer contenttype et processData sur false

$.ajax({
            type:"post",
            url:uploadUrl,
            data:{ "yourfiles": files} //这里改成obj对象,
            dataType: 'json',
            contentType: false,
            processData:false,
            success: function(data) {
                console.log(data);
            },
            error: function(data){
                        
            }
        });
迷茫

processData doit être défini sur false

Vous devez utiliser Ajax pour soumettre avec formData

var file = document.getElementById('changeFile').files[0]
var uploadUrl = "./php/data.php?action=upload_file"
var fd = new FormData()

fd.append('myFiles', file)

$.ajax({
    type:"post",
    url:uploadUrl,
    data: fd,
    processData: false,
    contentType: false,
    success: function(data) {
        console.log(data);
    },
    error: function(data){
        
    }
})
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal