I am trying to modify my code that creates HTML links from plain text. While it currently works well, I want to exclude any links that contain .png or .jpg extensions.
Does anyone have suggestions on how to adjust the regular expression?
var urlPattern = /(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&:\/~+#-]*[\w@?^=%&\/~+#-])?/gi;
return function(text, target) {
var replace = text.replace(urlPattern, '<a target="' + target + '" href="$&">$&</a>');
return replace
};
To enforce restrictions, you can incorporate anchors and look-ahead with alternatives:
var urlPattern = /^(?!.*(?:png|jpg)$)(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&:\/~+#-]*[\w@?^=%&\/~+#-])?$/gi;
function replaceText(text, target) {
var replacedText = text.replace(urlPattern, '<a target="' + target + '" href="$&">$&</a>');
return replacedText;
};
alert(replaceText("http://some.site.com/new/1.gif", "_blank"));
alert(replaceText("http://some.site.com/new/1.png", "_blank"));The key component is ^(?!.*(?:png|jpg)$): it ensures the validation starts from the beginning of the string and confirms there are no occurrences of png or jpg at the end.
For lengthier strings containing URLs, consider using this regex pattern, which assumes URL strings do not contain spaces:
var urlPattern = /(?!\S*(?:png|jpg)(?:$|\s))(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&:\/~+#-]*[\w@?^=%&\/~+#-])?/gi;
I am attempting to create an HTML list displaying the id fields of game objects from a json file. However, it is not appearing in my user interface. I am unsure why it is not rendering properly. ---core.js--- var gameapp = angular.module('gameapp&ap ...
My current code is causing the path to fade in/out all at once instead of one after the other var periodClass = jQuery(this).parent().attr("class"); jQuery("svg path").each(function(i) { var elem = jQuery(this); if (elem.hasClass(periodClass)) ...
Within my web application, I am utilizing an ng-table that displays a large number of rows per page (up to 1000). One of the features is a select-all checkbox that triggers an ng-change function to mark each table row as selected. However, the execution ...
When you need to retrieve component data, there are two ways to do so: $vm.user and $vm.$data.user. Both methods achieve the same result in terms of setting and retrieving data. However, the question arises as to why there are two separate ways to access ...
Currently, in my application, I am working on creating an array using JS. $scope.items = []; As I add items to this array, I retrieve information from a Firebase Reference and populate the items array with it. es.addItem = function(item){ var produc ...
I'm working on a Ruby-on-Rails project and I want to include a string from the bootstrap datepicker into a hidden field. However, I am unsure of how to reference an input class in this process. Below is the structure of my form: <%= simple_form_f ...
I am attempting to run a test on a factory using protractor and angular.mocks Below is the code for the factory: angular.module('googlemarker', []) .factory('newMarker', newMarkerFactory); newMarkerFactory.$inject = ['$windo ...
Attempting to develop a web app featuring drop-down menus that display data from a SQL server database. After researching, I discovered how to utilize Node.js to output table data in the command prompt. var sql = require('mssql/msnodesqlv8'); ...
Currently diving into a new React.js project as a beginner. I have a little challenge in the code snippet below - looking to add a button that displays "Hello World" every time it's clicked using setState. Can anyone guide me on enhancing the DisplayM ...
I have a JavaScript function called "display()". I want to hide my navigation menu on click, but it is not working properly - it just blinks. I am looking for a solution that uses only JavaScript and does not involve querySelector. function display() { ...
Currently, I am developing a specialized command line interface (CLI) for managing various packages to be installed or uninstalled using npm. Should I execute npm through spawn('npm') or require('npm')? require('child_process&apos ...
I am attempting to highlight the clicked area by adding an active class using ui-sref-active. Unfortunately, it is not working with $state.includes(), even though I can see its value as true in the controller. Can someone assist me with this issue? See th ...
Recently, I implemented BehaviourSubject in a shared service to retrieve the current value when clicking a button. Everything seems to be working fine, however, there are instances where the API call within the subscribe block of BehaviourSubject is being ...
Greetings to everyone! I have dedicated my entire evening to understanding how to implement the (Math.floor(Math.random()) function as the coordinates for the .fillRect method on an HTML canvas element. Despite searching through this website and various ...
In order to achieve my objective of copying files while limiting the number of files copied in parallel based on a defined variable, I decided to divide an array of promises using calls to fs.copy into packets. These packets are then executed in series by ...
I've been attempting to clear out my html5 local sql database, but for some reason, it's not working as expected. Below is the code I'm using, and no matter what I try, the alert always shows that the length is greater than 0. Any ideas why ...
I've been experimenting with testing authenticated routes in Mocha, but I've run into an issue where the user created in the `before` or `beforeEach` hooks doesn't persist. Here's a snippet from my test.js: const should = require(&apo ...
My footer design includes a rounded left image, a repeating middle section, and a rounded right image. How can I ensure that it scales perfectly responsively without overlapping? Ideally, the solution would involve adjusting the width of the middle section ...
Hello there! I'm looking to achieve a tilted background div effect. Anyone have any tips or ideas on how I can do this? I'm new to web development and would appreciate the guidance. https://i.stack.imgur.com/wyj1X.png ...
Currently, I am in the process of developing a contact form within ASP.NET MVC. This contact form will allow users to easily attach regular files through traditional file and browse functions. Additionally, users will have the option to search for a specif ...