weixin_33688840 2016-05-15 20:40 采纳率: 0%
浏览 611

JS-使用Ajax获取文件名

I am trying to get the extension and name of a file using Ajax.

My ajax code looks like:

$.ajax({
    type: "POST",
    url: url,
    data: $("#updateMember").serialize(), 
    mimeType: "multipart/form-data",
    contentType: false,
    cache: false,
    processData: false,
    success: function (data) {
        alert(data);
    }
});

In PHP I have this

$imageFileType = pathinfo($_FILES["input9"]["name"], PATHINFO_EXTENSION);
echo $imageFileType;

and my html is

<form method="post" enctype="multipart/form-data" id="updateMember">
    <input id="input-9" name="input9" type="file" class="file file-loading" data-allowed-file-extensions='["png", "jpg", "gif", "jpeg"]' style="top: 0px;">
    <li class="menu__item"><input name="offerUpload" id="dashOffersBtn" class="menu__link menu_input btnDashboard" style="margin: 0 auto; height:20px;padding: 0;padding-bottom: 22px;width: 70%;" type="button" value="SAVE"></li>
</form>

but it seems to not work. What am I doing wrong?

  • 写回答

1条回答 默认 最新

  • bug^君 2016-05-15 20:59
    关注

    You have to use FormData() to make this possible, serialize or serializeArray() does not support file api's use the below solution :

    Main update for working solution

    I did update the Save button's type from button to submit please use the below html :

    <form method="post" enctype="multipart/form-data" id="updateMember">
        <input id="input-9" name="input9" type="file" class="file file-loading" data-allowed-file-extensions='["png", "jpg", "gif", "jpeg"]' style="top: 0px;">
        <li class="menu__item">
        <input name="offerUpload" id="dashOffersBtn" class="menu__link menu_input btnDashboard" style="margin: 0 auto; height:20px;padding: 0;padding-bottom: 22px;width: 70%;" type="submit" value="SAVE">
        </li>
    </form>
    

    and use the below jquery code to make it work

    jQuery('#updateMember').submit(function(e){
               e.preventDefault();
                var data = new FormData(this);
                    $.ajax({
                        type: "POST",
                        url: 'upload.php',
                        data: data, 
                        mimeType: "multipart/form-data",
                        contentType: false,
                        cache: false,
                        dataType: "html",
                        processData: false,
                        success: function(data) {
                            alert(data);
                        }
                    });
            });
    

    also use the below php code for extension :

    $data = $_FILES['input9'];
    $data_ext = explode('/',$data['type']);
    $extension = $data_ext[1];
    echo $extension;
    

    My test index.php code

    http://pastebin.com/L81xUbxL

    Change Url To your target url.

    Old non working

     var data = new FormData('#updateMember');
        $.ajax({
            type: "POST",
            url: url,
            data: data, 
            mimeType: "multipart/form-data",
            contentType: false,
            cache: false,
            dataType: "html",
            processData: false,
            success: function(data) {
                alert(data);
            }
        });
    

    for getting an extension you can do this

    $path_ = pathinfo($_FILES["input9"]["name"]);
    $extension = $path_['extension'];
    echo $extension;
    
    评论

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 MATLAB动图问题
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名