如何使用JavaScript验证图像大小(例如“5X4”)

How can I validate image sizes (expressed as e.g. “5X4”) using JavaScript?

本文关键字:例如 5X4 JavaScript 何使用 验证 图像      更新时间:2023-09-26

我必须使用JavaScript进行图像大小验证。尺寸以文本形式提供,格式为nXn -例如"5X4"或其他。

我已经做了一个测试,是否提供的大小包含一个" X ":

if(inputVal.indexOf("X")==-1) 
{
$('#erSize').append("*Size should be (e.g) 6X4");
}

但是这个测试也接受例如" aXg "

我如何检查输入"X"两侧的值只是整数?

使用正则表达式

var pattern = /[0-9]'X[0-9]/;
inp = "AXG"; //Sample
if(!pattern.test(inp))
 alert("Error");
http://jsfiddle.net/hFTJb/

if(/^'d+X'd+$/.test(inputVal)) // add i after the pattern to match x case-insensitive
{
    $('#erSize').append("*Size should be (e.g) 6X4");
}
// accepts "1X1"
// accepts "9999X9999"
// rejects "aaa1X1aaa"

RegEx可能是最好的方法,我将给出一个没有正则表达式的"原始"示例,它做同样的事情:

function ValidateImageSize(imgSize) {
    var arrDimensions = imgSize.toUpperCase().split("X");
    if (arrDimensions.length != 2)
        return false;
    var w = arrDimensions[0] * 1;
    var h = arrDimensions[1] * 1;
    return !isNaN(w) && !isNaN(h) && w > 0 && h > 0;
}

用法:

if (!ValidateImageSize(inputVal)) {
    $('#erSize').append("*Size should be (e.g) 6X4");
}

给它,因为它比RegEx更可读,你可以控制和理解每一步。
实时测试用例

您可以通过使用RegEx轻松做到这一点。

使用正则表达式作为/('d+)X('d+)/g

function isValidInput() {
  var regex = new RegExp(/('d+)X('d+)/g);
  var match = regex.exec(inputVal);
  if (match == null) {
    $('#erSize').append("*Size should be (e.g) 6X4");
  } else {
    // here 'match' will be an array of 2 numeric values [D,D] where d is an integer.
  }
}