Creating a script to open multiple URLs in HTML and JavaScript

Currently, I am working on creating a multiple URL opener using HTML and JavaScript. However, I have encountered an issue where HTTP links are opening fine but HTTPS links are not. Can someone provide assistance with this problem? Below is the code snippet.

function open_all() {
  var urls = document.getElementById("list_urls").value;
  var urls = urls.split('\n');
  var totalno = urls.length;
  var s;
  for (var i = 0; i < totalno; i++) {
    s = urls[i];
    if (s) {
      if (s.substr(0, 7) != 'http://') {
        s = 'http://' + s;
      }
      window.open(s);
    }
  }
  return false;
}
<form method="post" action="">
  <br />
  <textarea name="list_urls" id="list_urls" cols="60" rows="20"></textarea>
  <br />
  <br />
  <input value="Open URLs" class="submit" type="button" onClick="open_all();">
  <br />
  <input type="reset" value="Reset!">
  <br/>
</form>

Any help would be greatly appreciated!

Answer №1

The problem arises from the current code where http:// is added to URLs that start with https://. To resolve this, the logic needs to be adjusted to check for both https:// and http:// at the beginning of the URL. Additionally, the logic can be streamlined by using trim() to ensure there are no extra spaces in the line. See the revised code below:

function open_all() {
    var urls = document.getElementById("list_urls").value.split('\n');
    for (var i = 0; i < urls.length; i++) {
        var url = urls[i];
        if (url.trim()) {
            if (s.substr(0,7) != 'http://' && s.substr(0,8) != 'https://') 
                url = 'http://' + url;
            window.open(url);
        }
    }
    return false;
}

It's worth noting that your browser's popup blocker might interfere with opening multiple windows rapidly.

Answer №2

Ensure to include some additional logic in your if statement for the presence of "https-"

if(s.substr(0,7)!='http://' && s.substr(0,7)!='https:/')

:)

Answer №3

give this a shot

  function open_all_tabs() {
        debugger;
        var links = document.getElementById("list_links").value;
        var links_array = links.split('\n');
        var total_links = links_array.length;
        var current_link;
        for (var j = 0; j < total_links; j++) {
            current_link = links_array[j];
            if (current_link) {
                if (current_link.substr(0, 7) != 'http://' && current_link.substr(0, 8) != 'https://')
                    current_link = 'http://' + current_link;
                window.open(current_link);
            }
        }
        return false;
    }

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Express.js app issue: post id assigns category name instead

Currently, I am in the process of developing a blogging application using Express, EJS, and MongoDB. To view the GitHub repository for this project, please click on this link. The posts within my application are organized into different categories, each r ...

What is the best way to search for all results in MongoDB that have x appearing in any property?

Is it possible to search for all pictures in the mongoose framework with node and express that contain a specific parameter, regardless of which property holds that parameter? For example: If I enter "John Snow" in the search bar, I want to see all pictur ...

Connecting to a pathway of Material-UI menu items

I am currently utilizing Material-UI's menu components as part of my project requirements. However, I am encountering difficulties in properly routing each MenuItem to an existing route within my application. As a temporary solution, I have resorted ...

What does the use of square brackets signify in Vuex mutations?

I'm curious about the use of mutation values within brackets in Vuex. What does the code "" represent? export const SOME_MUTATION = 'SOME_MUTATION' Is this just a constant name for a function? If so, why is it enclosed in brackets "[]"? ...

Toggle the anchor tag to be active or inactive, akin to the functionality of the Twitter Bootstrap .disabled class

On my webpage, I have implemented an HTML editor widget that allows users to edit the content of the page. There is also an anchor tag for editing purposes. My goal is to dynamically enable or disable this anchor tag based on the user's mode of operat ...

Steps to completely eliminate all elements from an object using specific keys

I have been pondering the most efficient method to delete all elements of an object through an onClick function. The goal is for the handler to remove all elements. Despite attempts with methods like the delete keyword and filtering, clicking the clear all ...

Use setTimeout and setInterval with the initial input without parentheses or double quotation marks

<!DOCTYPE HTML> <html> <head> <script type="text/javascript"> var count=0; function increaseCount(){ document.getElementById('txt').value=count; count++; setTimeout(increaseCount(),1000); } </script> </head&g ...

Adjusting the background color of a MuiList within a React Material-UI Select component

Looking to customize the background color of the MuiList in a react material-ui Select component without affecting other elements. Specifically targeting the Select element with the name 'first'. Despite setting className and trying different cl ...

Converting a string into a Date in Typescript while disregarding the timezone

Upon receiving a date in string format like this (e.g.): "11/10/2015 10:00:00" It's important to note that this is in UTC time. However, when creating a Date object from this string, it defaults to local time: let time = "11/10/2015 10:00:00"; let ...

Executing a function within another function (triggering the logout action by clicking the logout link) in ReactJS

Is there a way to access a method outside the render function and call it inside another function in order to log out the user with a simple click? I encountered the following error: Cannot read property 'AuthLogout' of undefined Let me shar ...

Managing form submissions using Jquery and checkboxes

Whenever I submit my dynamically created form, all checkboxes briefly become selected for a split second. Does anyone have an explanation for this behavior? Is it common or is there something wrong with my code? Although the form submits correctly, it migh ...

"Enhance Your Phonegap Android App with Pinch Zoom Capability

I am currently working on an Android Application with the help of jQuery Mobile and Phonegap. My goal is to implement pinch zoom functionality on the App pages. I have come across several suggestions that involve using the following line, but unfortunatel ...

Tips for adding an asterisk to the label of a Material-UI switch component

I am trying to include an asterisk symbol in the label by passing a required prop with a property, but it doesn't seem to be functioning correctly. <FormControlLabel control={ <Switch onChange={event => ...

Is it possible to compile a .ts file at the root level without following the tsconfig.json configurations?

After dealing with the challenge of having both .ts and .js files coexisting in each folder for months, I have finally managed to get the app to compile correctly. The transition from JS to TS brought about this inconvenience, but the overall benefits make ...

What could be causing the issue of node-sass generated CSS files not loading on the initial GET request?

I've set up a node express app and incorporated sass support for the CSS. However, when I attempt to access http://myhost.com:port/css/whatever.css, the whatever.css file is generated in the express_app_root/public/css directory as expected. The *.scs ...

Using CSS to select a specific class within an attribute

Having trouble targeting a specific navigation item in a div using an attribute value in CSS. Here's the code I have so far: My goal is to target the navDepts class. HTML <div class="primary-nav" data-name="about"> <div class="sub ...

Vue.js axios method returns undefined; v-for directive fails to iterate - Issue on Wordpress site

Using a shortcode, I have integrated Vue.js into a Wordpress page. pl2010_vue_init_directory = pl2010_vue_init_directory || (function(ctx) { new Vue( { el: '#'+ctx.el, data: { errorMsg: "", successMsg: "", show ...

What causes the object to be updated with new values when I update reference variables in JavaScript?

Imagine having an object named x with values x = { a: 'abc', b: 'jkl' }, Next, I am assigning this object x to a new local variable y using var y = x. Now, when the value of var y changes as y.a = 'pqr', y.b = 'xyz&apos ...

Vue.js is experiencing functionality issues on mobile devices and other connected devices, however, it is operating smoothly on desktop devices when localhost is running

I recently ran into an issue while trying to run my Laravel project on localhost and connect it to other devices like mobiles and desktops/laptops using the local address. The function works perfectly on the hosting desktop but fails to work on other devic ...

Unable to properly execute Fetch Delete Request

When using the Fetch API, I am sending this request: const target = e.currentTarget; fetch(target.href, { method: 'delete', }) .then(res => console.log(22)) .catch(err => console.log(err)); In addition, here is the middleware that manag ...