JS делает работу в консоли, но не с OnClick

Question

Я новичок в веб-программирование и попытался сделать функцию входа (с HTML, CSS и только JS), но это не будет работать так же:/

<li> 
    <a id="myLink" href="#" onclick="MyFunction();"> 
     <i class="fa fa-user-plus" aria-hidden="true"></i> 
     &nbsp;Register 
    </a> 
    <script> 
     function MyFunction() { 
      var username = prompt("Please choose a username"); 
      var password = prompt("Please choose a password"); 
     } 
    </script> 
</li> 
<li> 
    <a id="myPw" href="#" onclick="MyPassword();"> 
     <i class="fa fa-unlock" aria-hidden="true"></i> 
     &nbsp;Login 
    </a> 
    <script> 
     function MyPassword() { 
      var verifyuser = prompt("Please enter your username") 
      var verifypw = prompt("Please enter your password") 
      if (verifyuser === username && verifypw === password) { 
       alert("You have been logged in!") 
      } 
     } 
    </script> 

Таким образом, в основном, когда я нажимаю «зарегистрироваться», посетителю предлагается выбрать имя пользователя и pw, которое позднее он может использовать для входа в систему, если он нажимает «login» Однако, если я зашел в java-консоль после регистрации и введите «имя пользователя» «просто посмотреть, помня ли имя« var »var, я получаю Uncaught ReferenceError: username is not defined(…).

ОДНАКО, когда я не нажимаю «Регистрация» и просто введите код js вручную в консоли js, это действительно работает. Поэтому я набираю это на консоли (по одной строке каждый):

var username = prompt("Please choose a username"); //now I enter a username 
var password = prompt("Please choose a password"); //now I enter a pw 
username (now it displays what I just entered when I was prompted for username) 
password (now it displays what I just entered for password) 

Любые идеи о том, в чем проблема?

Answer 1

Переменные Javascript относятся к функции, в которой они объявлены. Так как var password и var username записаны внутри MyFunction, это единственное место, где вы можете получить к ним доступ.

Что вы хотите сделать, это объявить эти переменные в глобальной области. Для этого вы можете заменить свой первый скрипт примерно так:

<script> 
    var username; 
    var password; 

    function MyFunction() { 
     username = prompt("Please choose a username"); 
     password = prompt("Please choose a password"); 
    } 
</script>