Check if URL matches multiple regex variables?

Question

I am making a jquery plugin which will embed videos from youtube and vimeo (and eventually other sites). Right now I have this code:

(function($) { 
    $.fn.embedFrame = function() {
        var youtube = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
        var vimeo = /(?:http?s?:\/\/)?(?:www\.)?(?:vimeo\.com)\/?(.+)/g;

        this.filter("a").html(function() {
            // CHECK IF THE LINK HREF MATCHES ANY OF THE ABOVE REGEX VARIABLE RULES

            // IF THE HREF MATCHES, RETURN AN IFRAME EMBED OF THE VIDEO
        });

        return this;
    };
}(jQuery));

I have a few questions:

How can I check if the link href matches any of the regex rules?
Is there a better way to organize my code? I plan to add many more video sites in the future.

Thanks.

adeneo · Accepted Answer · 2016-11-14 20:52:05Z

1

Keep your regular expressions in an array or object, and then just iterate and check if the links match any of them

(function($) { 
    $.fn.embedFrame = function() {
        var filter = {
            youtube : /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/,
            vimeo   : /(?:http?s?:\/\/)?(?:www\.)?(?:vimeo\.com)\/?(.+)/g
        }

        var videos = this.filter(function(_, el) {
            if ( el.tagName.toLowerCase() !== 'a' ) return false;

            return Object.keys(filter).some(function(reg) {
                return filter[reg].test( el.href );
            });
        });

        return this;
    };
}(jQuery));

FIDDLE

answered Nov 14, 2016 at 20:52

adeneo

319k29 gold badges410 silver badges392 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user7158745 Over a year ago

That works great, thanks! How would I register an "on click" event within the plugin so that I can embed a link when it's clicked on?

Collectives™ on Stack Overflow

Check if URL matches multiple regex variables?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related