title: Get and validate an user-input url with javascript
body: <p>I've a form to enter a url and must check if it is a url with JavaScript.</p>
  
  <p>The console in Firefox doesn't indicate any errors in the code (the debugger also, doesn't indicate anything) but it doesn't run.</p>
  
  <p>I've also tried to display the input without validation but nothing</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>document.getElementById("link").addEventListener("click", linkfuction, false);
  
  function linkfuction() {
    var link = document.getElementById("general-link").value;
  
    document.getElementById("1").innerhtml = "link";
  
    function ValidURL(link) {
      var regex = /(http|https):\/\/(\w+:{0,1}\w*)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&amp;%!\-\/]))?/;
      if (!regex.test(link)) {
        document.getElementById("1").innerhtml = "Enter a valid url";
        return false;
      } else {
        return true;
      }
    }
  
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div style="padding-bottom: 1rem;"&gt;
    &lt;form&gt;&lt;input type="text" id="general-link"&gt;&lt;input type="button" id="link" value="Download"&gt;&lt;/form&gt;
  &lt;/div&gt;
  &lt;div style="font-size: 1.5rem"&gt;
    &lt;p id="1"&gt;&lt;/p&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>