web-dev-qa-db-fra.com

comment supprimer c fakepath dans les navigateurs web tels que chrome, safari, opéra?

Comment supprimer c fakepath dans les navigateurs Web tels que chrome, safari, opéra?

dans IE et Firefox, il n’affiche que le nom du fichier, c’est correct

Mais dans Chrome, opéra, safari. C'est le spectacle C:\fakepath\700.jpg

Comment puis-je retirer C:\fakepath\in Chrome, opera, safari.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.js"></script>
<style type="text/css">
.inputWrapper {
    overflow: hidden;
    position: relative;
    cursor: pointer;
    /*Using a background color, but you can use a background image to represent a button*/
    background-color: #DDF;
}
.fileInput {
    cursor: pointer;
    height: 100%;
    position:absolute;
    top: 0;
    right: 0;
    /*This makes the button huge so that it can be clicked on*/
    font-size:50px;
}
.hidden {
    /*Opacity settings for all browsers*/
    opacity: 0;
    -moz-opacity: 0;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0)
}
</style>

<script type="text/javascript">//<![CDATA[ 
$(window).load(function(){
$(function() {
    $(".inputWrapper").mousedown(function() {
        var button = $(this);
        button.addClass('clicked');
        setTimeout(function(){
            button.removeClass('clicked');
        },50);
    });

    $('input[type=file]').change(function() {
        var $this = $(this);
        $this.parent().find('span').text($this.val());
    });
});
});//]]>  
</script>
<div class="inputWrapper" id="inputWrapper" style="height: 56px; width: 128px;">
    <input class="fileInput hidden" type="file" name="file2"/>
    <span></span>
</div>
javascripthtmlcssgoogle-chromesafari
15
user3215821

Utilisez simplement une expression régulière pour tout supprimer avant (et y compris) le dernier \.

 var path = "C:\\fakepath\\example.doc";
 var filename = path.replace(/^.*\\/, "");
 console.log(filename);

De toute évidence, vous obtiendrez path à partir de votre entrée de fichier.

22
Quentin

Et vous obtiendrez le nom du premier fichier.

document.getElementById("yourInputElement").files[0].name

Si vous souhaitez obtenir plusieurs noms de fichiers, vous devez effectuer une itération sur files.

14
Fusion

Quelque chose comme ce qui suit devrait fonctionner pour vous: 

<script type="text/javascript">
$(function() {
    $(".inputWrapper").mousedown(function() {
        var button = $(this);
        button.addClass('clicked');
        setTimeout(function(){
            button.removeClass('clicked');
        },50);
    });
    $('input[type=file]').on('change', function(e) {
        var filename = $(e.currentTarget).val().replace(/^.*\\/, "");
        $this.parent().find('span').text(filename);
    });
});
</script>
0
Lewis Buckley