javascript配列内の正規表現の文字列の一致を確認してください

Question

カスタムCMSのクライアント側の検証を書いています。テキスト領域にイメージを含むURLがないかどうかを確認し、httpの代わりにhttpsを使用する必要があることをユーザーに知らせる必要があります。

私は、httpで始まるURLを検索する方法を考え出した：

$('#template_form').submit(function() { 
     val = $("#template_data").val(); 
     if (val.match(/http:\/\//)) { 
      alert("You must set all complete image URLs to be https!"); 
      $("#logError").val("true"); 
      return false; 
     } 
     return true; 
    }); 

しかし、これも含まれている任意の正規のリンクに適用されます。これを<img>タグに限定すれば、文字列の最後の3文字を取得し、画像接尾辞の配列に対してindexOfを行うことができるので、より簡単になります。

イメージURLはカスタムタグに含めることも、altパラメータの一部にすることも、直接リンクとして送信することも、他の多くの方法で送信することもできます。配列に対して正規表現をテストする方法はありますか、配列をループして各要素に対して個別にString.indexOfを実行する必要がありますか？

理想的には、私はこのような何かしたい：

suffixes = [".jpg", ",jpeg", ".png", ".gif", ".tiff", ".bmp"]; 
if (val.match(/http:\/\//)) && suffixes.indexOf(**some kind of regex**) { 
    alert("You must set all complete image URLs to be https!"); 
    $("#logError").val("true"); 
    return false; 
} 

を私はかなりその正規表現がどうなるかを把握することはできません。

Answer 1

あなたのイメージ拡張を使用して正規表現を構築することができます。

var suffixes = ["jpg", "jpeg", "png", "gif", "tiff", "bmp"]; 

var re = new RegExp('http://[^>\\s]+?\.(?:' + suffixes.join('|') + ')'); 

if (re.test(val)) { 
    alert("You must set all complete image URLs to be https!"); 
    $("#logError").val("true"); 
    return false; 
} 

JSFiddle

コードデモ

var val = '<img src="http://www.google.com/test.jpg" />'; 
 
var suffixes = ["jpg", "jpeg", "png", "gif", "tiff", "bmp"]; 
 
var re = new RegExp('http://[^>\\s]+?\.(?:' + suffixes.join('|') + ')'); 
 

 
console.log(re.test(val));