PHP笔记网

这是原来chunchun的方式来检验文件的后缀是否为excel格式（需要自己写js来判断），效果就是这种chouchou的原来的效果：

<form action="#" method="post" enctype="multipart/form-data" id="importExcel" class="form-control">
    <input type="file" id="fileUpload" name="fileUpload" label="上传Excel文件"/>
    <input id="readExcel" type="button" class="btn btn-minier btn-success" value="导入">
</form>

function checkData() {
    var fileDir = $("#fileUpload").val();
    var suffix = fileDir.substr(fileDir.lastIndexOf("."));
    if ("" == fileDir) {
        layer.alert("选择需要导入的Exce文件！", {icon: 0, title: "提示"});
        return false;
    }
    if ((".xls" != suffix && ".xlsx" != suffix)) {
        layer.alert("选择Excel格式的文件导入！", {icon: 0, title: "提示"});
        return false;
    }
    return true;
}

找了一遍aceadmin官网，发现有文件上传的这个input的。

只需将input标签的type设置成file，然后用ace_file_input进行初始化（只设置成file是没有效果的！！！）

效果如图：

未选择文件时：

选择文件后：

点击这里可以看到效果

将input标签的type设置成file，然后用ace_file_input进行初始化

<div class="form-group col-sm-6">
    <form id="addForm" action="" enctype="multipart/form-data">
        <div class="col-xs-12">
            <div class="col-sm-12">
                 <input type="file" id="id-input-file" name="file"/>
            </div>
        </div>
    </form>
</div>
<button type="button" class="btn btn-success btn-sm" onclick="importexcel()">
    <span class="ace-icon fa fa-cloud-upload bigger-110"></span>导入
</button>

 $('#id-input-file').ace_file_input({
    no_file:'未选择文件',
    btn_choose:'选择文件',
    btn_change:'更换文件',
    droppable:true,             // 可拖拽上传
    allowExt: ['xls','xlsx'],   // 允许的文件格式
}).on('file.error.ace', function(event, info) { // 不匹配上面的文件格式就会跳出弹框提示
    layer.alert("选择Excel格式的文件导入！", {icon: 0, title: "提示"});
});