如何使用 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]))$
您可以在网站上测试
所以我的网络表单上有一个文本字段,用户将使用它来输入文件路径。我想检查输入的内容是否以 .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]))$
您可以在网站上测试