未捕获语法错误：输入Javascript意外结束_Javascript_Ajax_Json

未捕获语法错误：输入Javascript意外结束

javascript ajax json

未捕获语法错误：输入Javascript意外结束,javascript,ajax,json,Javascript,Ajax,Json,我想学习JavaScript，并尝试创建一个多Ajax上传程序。我遇到了以下错误：在Google Chrome中：未捕获的语法错误：输入意外结束在Mozilla Firebug中 SyntaxError:JSON.parse:JSON数据第1行第1列的数据意外结束 upload=JSON.parse（this.response）还有我的JavaScript文件 var app = app || {}; (function(o) { "use strict"; var ajax, g

我想学习JavaScript，并尝试创建一个多Ajax上传程序。我遇到了以下错误：在Google Chrome中：

未捕获的语法错误：输入意外结束

在Mozilla Firebug中

SyntaxError:JSON.parse:JSON数据第1行第1列的数据意外结束

upload=JSON.parse（this.response）

还有我的JavaScript文件

 var app = app || {};

(function(o) {
"use strict";

var ajax, getFormData, setProgress;

ajax = function(data) {
    var xmlhttp = new XMLHttpRequest(), uploaded;

    xmlhttp.addEventListener('readystatechange', function() {
        if (this.readyState === 4) {
            if (this.status === 200) {
                uploaded = JSON.parse(this.response);//this is where error occurs
                if (typeof o.options.finished === 'function') {
                    o.options.finished(uploaded);
                }
            } else {
                if (typeof o.options.error === 'function') {
                    o.options.error();
                }
            }
        }
    });

    xmlhttp.upload.addEventListener('progress', function(event) {
        var percent;

        if (event.lengthComputable === true) {
            percent = Math.round((event.loaded / event.total) * 100);
            setProgress(percent);
        }
    });

    xmlhttp.open('post', o.options.processor);
    xmlhttp.send(data);
};

getFormData = function(source) {
    var data = new FormData(), i;

    for (i = 0; i < source.length; i = i + 1) {
        data.append('file[]', source[i]);
    }

    data.append('ajax', true);
    return data;
};

setProgress = function(value) {
    if (o.options.progressBar !== undefined) {
        o.options.progressBar.style.width = value ? value + '%' : 0;
    }
    if (o.options.progressText !== undefined) {
        o.options.progressText.innerText = value ? value + '%' : '';
    }
};

o.uploader = function(options) {
    o.options = options;

    if (o.options.files !== undefined) {
        ajax(getFormData(o.options.files.files));
    }
  };
}(app));

var-app=app | |{}；
（职能（o）{
“严格使用”；
var ajax、getFormData、setProgress；
ajax=函数（数据）{
var xmlhttp=new XMLHttpRequest（），已上载；
addEventListener（'readystatechange'，function（）{
if（this.readyState==4）{
如果（this.status==200）{
upload=JSON.parse（this.response）；//这是发生错误的地方
如果（o.options.finished的类型==='function'）{
o、 选项。完成（上传）；
}
}否则{
if（o.options.error的类型=='function'）{
o、 options.error（）；
}
}
}
});
xmlhttp.upload.addEventListener（'progress'，函数（事件）{
风险值百分比；
if（event.lengthComputeable==真）{
百分比=数学舍入（（event.loaded/event.total）*100）；
进度（百分比）；
}
});
open（'post'，o.options.processor）；
发送（数据）；
};
getFormData=函数（源）{
var data=new FormData（），i；
对于（i=0；i


我的Php文件
<?php
header('Content-Type:application/json');

$uploaded = [];
$allowed = ['MP4','PNG','JPG'];

$succeded = [];
$failed = [];

if (!empty($_FILES['file'])) {
foreach ($_FILES['file']['name'] as $key => $name) {
    if ($_FILES['file']['error'][$key] === 0) {

        $temp = $_FILES['file']['tmp_name'][$key];
        $ext = explode('.', $name);
        $ext = strtolower(end($ext));

        $file = md5_file($temp) . time() . '.' . $ext;

        if (in_array($ext, $allowed) === true && move_uploaded_file($temp, "uploads/{$file}") === true) {
            $succeded[]  = array(
                'name' => $name,
                'file' => $file
            );
        } else {
            $failed[] = array(
                'name' => $name
            );
        }
    }
}
if (!empty($_POST['ajax'])) {
    echo json_encode(array(
        'succeded' => $succeded,
        'failed' => $failed
    ));
 }
}

可能是无效的jsonconsole.log（this.response）
在此处设置上传的变量并在此处发布：）this.response
可能实际上已经是一个对象（请参阅），因此您可能根本不必使用JSON.parse
。如果改用this.reponseText
会发生什么？另外，请确保您没有echo
ing多个内容。请尝试console.log（this.responseText）
upload=JSON.parse（this.responseText）@NewToJS我更新了我的问题，并尝试了你的建议。现在错误指向第行的index.php1@ian可以console.log（this.responseText）并在您的问题中显示结果，好吗？我希望看到ajax的响应。非常感谢。
<!DOCTYPE html>
<html>
<head> 
<meta charset ="UTF-8"/>
<title>Ajax Uploader</title>
<link rel="stylesheet" href="global.css"/>
</head>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data"  id="upload" class="upload">
    <fieldset>
        <legend>Upload files</legend>
        <input type="file" id="file" name="file[]" required multiple>
        <input type="submit" id="submit" name="submit" value="upload">
    </fieldset>

    <div class="bar">
        <span class="bar-fill" id="pb"><span class="bar-fill-text" id ="pt"></span></span>      
    </div>

    <div id="uploads" class="uploads">
        Uploaded file links will appear here.
    </div>
</form>
<script type="text/javascript" src="upload.js"></script>
<script type="text/javascript">
    document.getElementById('submit').addEventListener('click', function(e) {
        e.preventDefault();

        var f = document.getElementById('file'),
            pb = document.getElementById('pb'),
            pt = document.getElementById('pt');

        app.uploader({
            files: f,
            progressBar: pb,
            progressText: pt,
            processor: 'upload.php',

            finished: function(data) {
                var uploads = document.getElementById('upload'),
                    succeeded = document.createElement('div'),
                    failed = document.createElement('div'),

                    anchor,
                    span,
                    x;

                    if (data.failed.length) {
                        failed.innerHTML = '<p>Unfortunately, the following is an error:</p>';
                    }

                    uploads.innerText = '';

                    for (x = 0;x < data.succeeded.length;x= x + 1) {
                        anchor = document.createElement('a');
                        anchor.href ='uploads/' + data.succeeded[x].file;
                        anchor.innerText = data.succeeded[x].name;
                        anchor.target = '_blank';

                        succeeded.appendChild(anchor);
                    }

                    for (x = 0; x < data.failed.length; x = x + 1) {
                        span = document.createElement('span');
                        span.innerText = data.failed[x].name;

                        failed.appendChild(span);
                    }

                    uploads.appendChild(succeeded);
                    uploads.appendChild(failed);
            },

            error: function() {
                console.log('not working');
            }
        });
    });
</script>