To redirect to custom html page from another custom made

Question

Let say I made 3 web pages: fake google, fake facebook, and fake instagram. I am currently at fake google, now I want to go to fake facebook or fake instagram on basis of what I type into the search box. How do I redirect to them using javascript?

var form = document.getElementById('addForm');
form.addEventListener('submit', redirect);

var newItem = document.getElementById('item').value; // this collects value that I have entered in search box for eg fake facebook or fake insta

function redirect(e) {
  e.preventDefault();

  if (newItem == 'fakefacebook')
    window.open('file:///C:/html/index.html');
  else if (newItem == 'fakeinstagram')
    window.open('file:///C:/fakeinsta/index.html');
}

I want to open another page after clicking submit. I don't want to open links like google which are already on the internet, I want to open something that I have made on my PC.

Answer 1

You need to move getting the value of the text box into the submit handler. At the moment the value for newItem is being set when the page loads, and never again.

 var form = document.getElementById('addForm'); form.addEventListener('submit', redirect); function redirect(e) { e.preventDefault(); let newItem = document.getElementById('item').value; // this collects value that I have entered in search box for eg fake facebook or fake insta if (newItem == 'fakefacebook') { window.open('file:///C:/html/index.html'); } else if (newItem == 'fakeinstagram') { window.open('file:///C:/fakeinsta/index.html'); } } 

 <form id="addForm"> <p><label for="item">Input the search term:</label><input type="text" id="item"> <p><input type="submit"></p> </form>