JS / Jquery，匹配找不到PNG =匹配（'/ gif | jpg | jpeg | png /'）

Question

我有以下代码用于匹配fancybox可能的元素：

$('a.grouped_elements').each(function(){
    var elem = $(this);
    // Convert everything to lower case to match smart
    if(elem.attr('href').toLowerCase().match('/gif|jpg|jpeg|png/') != null) {
        elem.fancybox();
    }
});

它适用于JPG，但由于某些原因它不匹配PNG。 有人看到代码的错误吗？ 谢谢

Answer 1

有几件事。

Match接受RegExp的对象，而不是字符串。 它可能在某些浏览器中有效，但绝对不是标准的。

 
 
 
  
  "gif".match('/gif|png|jpg/'); // null​​​​​​​​​​​​​​​​​​​​​​​​​​​​
 
  

没有字符串

"gif".match(/gif|png|jpg/); // ["gif"]

此外，您需要在文件名末尾检查这些，而不是在字符串中的任何位置。

 
 
 
  
  "isthisagif.nope".match(/(gif|png|jpg|jpeg)/); // ["gif", "gif"]
 
  

只搜索带有$ suffix的字符串末尾

"isthisagif.nope".match(/(gif|png|jpg|jpeg)$/); // null

不需要使href小写，只需做一个不区分大小写的搜索/i 。

在图像扩展名之前查找一个点作为附加检查。

还有一些测试。 我不知道你是如何使用.match的字符串参数得到任何结果的。 你在用什么浏览器？

Answer 2

我猜它会在字符串中的任何地方匹配（例如它会匹配“ http://www.giftshop.com/ ”），这可能被视为一个错误。 我用了

/\.(gif|jpe?g|png)$/i

Answer 3

您将字符串传递给match（）函数而不是正则表达式。 在JavaScript中，字符串用单引号分隔，正则表达式用正斜杠分隔。 如果你同时使用两者，你​​有一个字符串，而不是一个正则表达式。

Answer 4

这对我来说很完美： /.+\\.(gif|png|jpe?g)$/i

.+ - >任何字符串

\\. - >接下来一点。

(gif|png|jpe?g) - >然后是任何这些扩展。 jpeg可能有也可能没有字母e。

$ - >现在是它预期的字符串的结尾

/i - >不区分大小写的模式：匹配sflkj.JPG和lkjfsl.jpg