Javascript 如何在像chrome、safari、opera这样的webkit浏览器中删除c伪造路径？

如何在像chrome、safari、opera这样的webkit浏览器中删除c伪造路径

在IE和Firefox中，只显示文件名，这没关系

但在Chrome、opera和safari中。它是show C:\fakepath\700.jpg

如何删除Chrome、opera、safari中的C:\fakepath\

<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>

.输入包装器{
溢出：隐藏；
位置：相对位置；
光标：指针；
/*使用背景色，但可以使用背景图像来表示按钮*/
背景色：#DDF；
}
.文件输入{
光标：指针；
身高：100%；
位置：绝对位置；
排名：0；
右：0；
/*这使得按钮变得巨大，因此可以点击它*/
字体大小：50px；
}
.隐藏{
/*所有浏览器的不透明度设置*/
不透明度：0；
-moz不透明度：0；
过滤器：progid:DXImageTransform.Microsoft.Alpha（不透明度=0）
}
//  

只需使用正则表达式即可删除最后一个

\

之前的所有内容

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

---

显然，您可以从文件输入中获得

路径。
类似于以下内容的内容应该适合您：

<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>


$（函数（）{
$（“.inputWrapper”）.mousedown（函数（）{
var按钮=$（此按钮）；
addClass（'clicked'）；
setTimeout（函数（）{
按钮。removeClass（“单击”）；
},50);
});
$（'input[type=file]'）。在（'change'，函数（e）上{
var filename=$（e.currentTarget.val（）.replace（/^.*\\/，“”）；
$this.parent（）.find（'span'）.text（文件名）；
});
});
您将获得第一个文件的名称

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

如果要获取多个文件名，必须迭代
文件
使用以下代码：

<label for="file" class="input input-file"><div class="button"><input type="file" onchange="this.parentNode.nextSibling.value = this.value" name="uploadfiliron" class="uploadimg" data-gotfile='uploadimg-1'>Browse</div><input type="text" readonly class="uploadimg-1"></label>

浏览

这是剧本

<script>$('body').on('change','.uploadimg',function(e){
var filename = $(this).val().replace(/.*(\/|\\)/, '');
var getft = $(this).attr('data-gotfile');
console.log(getft+" "+filename);
if(filename=='')
    {
        $('.'+getft).val('No file chosen');
    }
    else
    {
        $('.'+getft).val('Your file name: '+filename);
    }});</script>

$（'body'）.on（'change'，'uploadimg'，函数（e）{
var filename=$（this.val（）.replace（/.*（\/\\）/，“”）；
var getft=$（this.attr（'data-gotfile'）；
console.log（getft+“”+文件名）；
如果（文件名=“”）
{
$（'.+getft.val（'未选择文件'）；
}
其他的
{
$（'.+getft）.val（'您的文件名：'+filename）；
}});
警告：此解决方案不错，但并不完美。如果文件名包含反斜杠（例如，在Unix系统上），则无法获得正确的文件名！一个更好的解决方案是使用
path.replace（/^C:\\fakepath\\/，“”）
@stackular您的也不完美。你有打字错误。替换（“C:\\fakepath\\”，“”）@埃姆拉什么打字错误？并且不要使用regexp在文件名的开头捕捉'C:\fakepath'。可能是重复的，请检查答案并标记一个。是的。。此外，您甚至不需要jQuery。谢谢您，@Fusion。这是最高级的方法。Unix文件名可以包含反斜杠，此解决方案不考虑这一点。