语义-ui 表单验证：图像url

Question

是否可以验证输入是图像 url？

我尝试了以下天真的方法：

validations.img = {
      identifier: 'img',
      rules: [{
        type: 'url',
        prompt: 'not a valid URL'
      },
      {
        type: "contains[.png, .jpg, .jpeg, .gif, .tiff, .tif]",
        prompt: 'not image'
      }]
    };

但看起来 contains 正在执行 AND 运算。我可以让它做手术吗？

Answer 1

semantic-ui 允许您在 $.fn.form.settings.rules 上添加验证规则添加功能，例如，如果您想检查 string 是否包含数组元素之一 [.png, .jpg, .jpeg, .gif, .tiff, .tif] 您可以添加一个新函数，例如 containsInArray，如下所示：

// function to check if the text contains an element from the array
$.fn.form.settings.rules.containsInArray = function(text,csv){
    var array = csv.split(','); // you're separating the string by commas
    var isContains = false; // return value
    // for each element check it usign contains function
    $.each(array,function(index,elem){
        if($.fn.form.settings.rules.contains(text,$.trim(elem))){
            // if condition are meet set the result as true
            // and breaks the loop
            isContains = true;
            return false;
        }
    });
    console.log(text + " " + isContains);
    return isContains; 
};

也许该功能可以更有效，您可以尝试改进它，但它适用于您的情况。

那么你必须改变规则，使用 type: "containsInArray[.png, .jpg, .jpeg, .gif, .tiff, .tif]" 而不是 type: "contains[.png, .jpg, .jpeg, .gif, .tiff, .tif]"。

看到这个工作 jsfiddle

语义-ui 表单验证：图像url

semantic-ui form validation: image url

javascript

semantic-ui