Linking Files Together

Question

How can I link files together? What I mean by that is, how do I create a button, and when clicked, takes you to another site? (Or in my case, the next page of reading) Sorry for stupid question, I'm new to coding, and I only know password based buttons. :(

    password: <input type=password ID="Next"> <button onclick="correctpassword ();">submit</button>
    </div>
    <script type="text/javascript">
        function correctpassword () { 
            var code = document.getElementById ("Next").value; 
            // alert ("Haha! I know your password! It's \"" + code + "\""); 
            if (code == "Next") {
                location = "NHD2.html";
            } else if (code == "next") 
                alert ("So Close!!"); 
            else location = "LoginWrongSite2.html";
        }

Is what I have.

When you say you want to create a link button, why not you create a plain html link without using javascript? `
button
` — Vincent1989, Oct 10 '17 at 01:45
DiegoTArgs answer is good, also see https://stackoverflow.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link for more options — visibleman, Oct 10 '17 at 02:38

score 0 · Accepted Answer · edited Oct 10 '17 at 10:25

I think you want to simulate a little form.

If that is what you try to do then try this (be sure to have both pages on the same directory):

Page1.html

<!DOCTYPE html>
<html>
<head>
  <title>Page1</title>
</head>
<body>

  <form onsubmit="submitform(event)" action="Page2.html">
    Name: <input type="text" placeholder="Your name here" id="username"/>
    Password <input type="password" id="userpassword"/>
    <button type="submit">Submit</button>
  </form>

  <script type="text/javascript">
    function submitform(event) {
      var username = document.getElementById('username');
      var userpassword = document.getElementById('userpassword'); 
      if(username.value !== 'test' || userpassword.value !== '1234') {
        event.preventDefault();
      }
    }
  </script>

</body>
</html>

Page2.html

<!DOCTYPE html>
<html>
<head>
  <title>Page1</title>
</head>
<body>

  We are good !

</body>
</html>

This will basically define a form in the page1. When you type test as username and 1234 as password in that page it will be submitted and you will navigate to what action attribute says. If you enter a value different than test for ussername or 1234 for password navigation will be cancelled.

Of course this is just a simple example, in a real app you will not do something like this, it is just to let you know how to navigate from page1 to page2 (there are other ways as well like links for instance).

Hope this helps !

Yes, it does, it even asks if I want to save password for the site, but the thing is, I don't see the place in your code where it will transfer you to the next page, if its already there, please tell which part. — MAXPower, Oct 10 '17 at 03:15
When you hit the submit button the submitform function will execute. If you enter the correct data (test and 1234) the normal behavior of the form won't be cancelled and you will navigate. By normal behavior I mean, when the form is submitted by clicking a submit button like the one I declared, the form data is submitted to the url indicated in the action atribute. So that is what makes you navigate to next page. I hope this helps you. — DiegoTArg, Oct 10 '17 at 03:23

Linking Files Together

1 Answers1