javascript - 多图片上传预览和ajax发送的问题

我现在做一个图片发送的功能，但是预览的都是最后选择的照片，并且所有的照片都一样，还有就是图片上传该怎么用ajax发送，多谢了。以下是代码：
HTML代码：

<code><form id="fileUpload" enctype="multipart/form-data">
    <div class="upload-layer">
        <ul class="upload-ul">
            <li>
                <input id="imglist" type="file" name="imageUpload[]" multiple accept="image/*">
                <label for="imglist" id="img-label">选择文件
                </label>
            </li>
        </ul>
        <div class="upload-sub">
            <input type="button" id="upload-btn" value="提交">
        </div>
    </div>
</form></code>

js代码：
这是图片预览部分js代码

<code>$(function(){
    $("input[type='file']").change(function(evt){
        var files = evt.target.files;
    
        for (var i = 0, f; f = files[i]; i++) {
    
            if (!f.type.match('image.*')) {
                continue;
            }
    
            var reader = new FileReader();
            reader.readAsDataURL(f);
            reader.onload = (function() {
                return function(e) {
                    $(".upload-ul").prepend("<li><img  src="" alt="javascript - 多图片上传预览和ajax发送的问题" ></li>");
                    $(".upload-ul img").attr("src",e.target.result);//预览图片的位置
                };
            })(f);
        }
    });
})</code>

这是ajax发送部分代码：

<code>$("#upload-btn").click(function(){
    var formData = $("imglist").attr('name');
    formData.append('img',fileData);
    $.ajax({
        type: "POST",
        url: "{{ path('advsimghandle_') }}",
        dataType:"json",
        data:{
            imageUpload: formData
        },
        success:function(msg){

        }
    })
})</code>

请问我改怎么获取这个name的属性？还有文件预览都是预览到同样的一张图片，譬如说我选择两张图片，结构都是预览到第二张，第一张好像是循环的时候被过滤掉了，是不是该判断还是？，我改怎么改这个代码才能分别预览到照片。另外ajax也有问题的，通过firebug查看是没有post东西到后台的。多谢了。

回复内容：

我现在做一个图片发送的功能，但是预览的都是最后选择的照片，并且所有的照片都一样，还有就是图片上传该怎么用ajax发送，多谢了。以下是代码：
HTML代码：

<code><form id="fileUpload" enctype="multipart/form-data">
    <div class="upload-layer">
        <ul class="upload-ul">
            <li>
                <input id="imglist" type="file" name="imageUpload[]" multiple accept="image/*">
                <label for="imglist" id="img-label">选择文件
                </label>
            </li>
        </ul>
        <div class="upload-sub">
            <input type="button" id="upload-btn" value="提交">
        </div>
    </div>
</form></code>

js代码：
这是图片预览部分js代码

<code>$(function(){
    $("input[type='file']").change(function(evt){
        var files = evt.target.files;
    
        for (var i = 0, f; f = files[i]; i++) {
    
            if (!f.type.match('image.*')) {
                continue;
            }
    
            var reader = new FileReader();
            reader.readAsDataURL(f);
            reader.onload = (function() {
                return function(e) {
                    $(".upload-ul").prepend("<li><img  src="" alt="javascript - 多图片上传预览和ajax发送的问题" ></li>");
                    $(".upload-ul img").attr("src",e.target.result);//预览图片的位置
                };
            })(f);
        }
    });
})</code>

这是ajax发送部分代码：

<code>$("#upload-btn").click(function(){
    var formData = $("imglist").attr('name');
    formData.append('img',fileData);
    $.ajax({
        type: "POST",
        url: "{{ path('advsimghandle_') }}",
        dataType:"json",
        data:{
            imageUpload: formData
        },
        success:function(msg){

        }
    })
})</code>

请问我改怎么获取这个name的属性？还有文件预览都是预览到同样的一张图片，譬如说我选择两张图片，结构都是预览到第二张，第一张好像是循环的时候被过滤掉了，是不是该判断还是？，我改怎么改这个代码才能分别预览到照片。另外ajax也有问题的，通过firebug查看是没有post东西到后台的。多谢了。