HTML5中关于文件的上传

//此处使用的是bootstrap来布局的可以忽略

<div class="printTInfo">
    <div class="form-group formgroup">
        <input type="text" class="form-control check" id="fileName" name="fileName" readonly placeholder="">
    </div>
    <div class="form-group">
        <span class="btn btn-success start fileinput-button" style="position: relative;">
            <i class="fa fa-upload"></i>
            <span> 上传 </span>
        <input type="file" id="file" readonly name="file"  multiple="">
        </span>
    </div>
</div>

//点击上传按钮处理事件
            //看到要上传的是什么
$("#file").change(function () {
    var index = $(this).val().lastIndexOf("\\");
    if (index != -1)
        $("#fileName").val($(this).val().substring(index + 1));
    else
        $("#fileName").val($(this).val());
    //显示之后就要请求后台加载文件里面的数据
    if (window.FormData) {
        var formData = new FormData();//此处使用的就是FormData对象进行上传的文件,最后会着重介绍一下这个对象。
        formData.append('upload', document.getElementById('file').files[0]);//此处是将刚刚上传的文件里面的数据放到formdata对象里面
以键值对的形式存放。
        $.ajax({
            url: getBasePath() + "/此处是请求(加载)数据的一个路径",
            type: "POST",
            data: formData,
            contentType: false,
            processData: false,
            success: function (data) {
                //填充表格
                config1.data = data.加载的是返回过来的数据;
                fullTable(config1);
                //默认所有的数据都被选中
                $('#list4').find('input[type="checkbox"]').each(function () {
                   $(this).attr('checked');
                });//此处用的是jqgrid.表格来操作的
                showMsg(data.Body.MsgDes);
            }
        });
    }
})