Javascript在上传之前验证文件名

时间:2011-11-05 17:24:38

标签: javascript validation

我只想验证正在上传的图片的文件名,以确保它没有空格或不寻常的字符。

这是我最近的搜索尝试,但仍然没有运气。它可能与文件的路径有关吗?它是考虑这个还是只考虑文件名?

我有这个并且使用php检查扩展工作服务器端,但我想在提交之前向用户提示。

此时,即使我使用的文件名是应该接受还是应该拒绝的文件名,我也会弹出警报。

的JavaScript

function validate(elem){
    var alphaExp = /^[a-zA-Z_-]+$/;
    if(elem.value.match(alphaExp)){
        return true;
    }else{
        alert("File name not suitable");
        elem.focus();
        return false;
    }
}

HTML

<label for="file">Filename:</label>
<input type="file" name="filename" id="filename" onchange="validate(this)" /> 
<p><input type="submit" name="submit" class="submit" value="Submit" />
</form>

3 个答案:

答案 0 :(得分:3)

您需要为此使用更复杂的正则表达式,因为您检查的elem.value不会像image123.jpg那样更像C:\fakepath\randomfolder\some other folder\image123.jpg

您可能需要查看此内容:http://www.codeproject.com/Tips/216238/Regular-Expression-to-validate-file-path-and-exten

您可以在此页面上找到的例子主要是文档,而不是图片,但您可以根据自己的需要进行扭曲:

^(?:[\w]\:|\\)(\\[a-z_\-\s0-9\.]+)+\.(png|gif|jpg|jpeg)$

答案 1 :(得分:0)

你也可以使用这个功能......

 <script type="text/javascript">
function getNameFromPath(strFilepath) {
    var objRE = new RegExp(/([^\/\\]+)$/);
    var strName = objRE.exec(strFilepath);

    if (strName == null) {
        return null;
    }
    else {
        return strName[0];
    }
}
</script>

<script language="javascript">
function Checkfiles() {
    var fup = document.getElementById('filename');
    var fileName = fup.value;
    var ext = fileName.substring(fileName.lastIndexOf('.') + 1);
    if(ext == "gif" || ext == "GIF" || ext == "JPEG" || ext == "jpeg" || ext == "jpg" || ext == "JPG" || ext == "doc") {
        return true;
    } else {
        alert("Upload Gif or Jpg images only");
        fup.focus();
        return false;
    }
}
</script>

答案 2 :(得分:0)

使用test函数

非常简单

&#13;
&#13;
function validate(form){
  if (/\s/.test(form.elements.file.value)) {
    alert(' filename contains spaces. Please rename the file.');
    return false;
  }
  return true;
}
&#13;
<html>
<body>
<form onsubmit="return validate(this);">
  <input type="file" name="file" value="" >
  <input type="Submit" value="Submit" >
</form>
</body>
</html>
&#13;
&#13;
&#13; 来源https://codehurdles.blogspot.in/2017/11/javascript-validate-filename-before.html