如何使用 RegEx 检查表单输入是否以 .pdf 结尾

How to use RegEx to check if form input ends with .pdf

所以我的网络表单上有一个文本字段,用户将使用它来输入文件路径。我想检查输入的内容是否以 .pdf 结尾

我一直在四处寻找,看起来 RegEx 是我需要用来获得多个浏览器支持的东西,但我找不到一个好的例子。

HTML 字段

<input type="text" name="filelocation" id="filelocation" placeholder="Must include .pdf file extension">

正则表达式可能是错误的工具。尝试

var arr = path.split('.');
if (arr[arr.length - 1] === 'pdf') {
  //do your thing
}

这应该在任何浏览器中都能正常工作。

如果您更喜欢正则表达式解决方案(这对于任何性能比较来说都不够复杂,因此完全取决于您的口味)请参阅 CodeiSir 的回答。它使用 HTML 模式属性。

您可以使用 pattern 属性来这样做:

<form action="#">
  <input type="text" pattern=".+\.pdf$" placeholder="Must include .pdf file extension">
  <input type="submit">
</form>

它还将确保在末尾 .pdf 之前有一些文本

你需要的表达式是/\.pdf$/.

示例:

document.querySelector('#filelocation').addEventListener('blur', check);

function check(e) {
 alert(/\.pdf$/.test(e.target.value));
}
<input type="text" name="filelocation" id="filelocation" placeholder="Must include .pdf file extension">

您可以使用match方法检查名称字符串末尾是否有.pdf


var fileName1 = "something.pdf";
var fileName2 = "other.pdf.not.valid";
var fileName3 = "somethingpdf";

var outputDiv = 'output';

validatePdfFileName(fileName1, outputDiv);
validatePdfFileName(fileName2, outputDiv);
validatePdfFileName(fileName3, outputDiv);

function validatePdfFileName(fileName, outputDivId) {
  var outputDiv = document.getElementById(outputDivId);


  if (fileName.match(/\.pdf$/)) {
    outputDiv.innerHTML = outputDiv.innerHTML + "</br> valid pdf file name: " + fileName + " </br>";
  } else {
    outputDiv.innerHTML = outputDiv.innerHTML + "</br> invalid pdf file name: " + fileName + " </br";
  }
}
<div id="output">Output</br></div>

我同意 RegEx 可能不是最好的解决方案。因此,我推荐 Jared Smith 的回答。但是,如果您真的想为此使用 RegEx,请尝试以下模式:

var PdfPattern = /*\.pdf$/i;

此模式将匹配任何以“.pdf”结尾且不区分大小写的字符串(例如,"something.pdf" 等同于 "something.PDF"、"something.PdF" 等)。

如果您询问此问题是为了允许文件上传,那么,出于安全原因,您还应该进行 server-side 检查以确保上传的文件实际上是 PDF。在 Javascript 中进行检查 client-side 不足以确保安全。

适用于我的正则表达式如下

^[a-zA-Z�-ú0-9\s]{3,50}[.]{1}(([pP][dD][fF]))$

您可以在网站上测试

https://regexr.com/