html表单中的动作脚本未正确执行

Question

I am trying to learn a bit web development and want to build my own small website with a login screen. The html form looks like this:

<form action="./scripts/login.php" method="post">
    <input type="text" name="username" placeholder="Enter Username" autofocus>
    <input type="password" name="password" placeholder="Enter Password">
    <p>Forgot password?</p>
    <input type="submit" value="Confirm" name="submit_login">
</form>

and the login.php like this:

<?php
alert("Hello World");

function alert($msg) {
    echo "<script type='text/javascript'>alert('$msg');</script>";
}

If I open the website from phpstorm and click on the submit button then I get redirected to the login.php, but the website shows the error 404 not found (even if the path is correct). If I press f5 to reload the website I get the message "To display this page, Firefox must send information that will repeat any action (such as a search or order confirmation) that was performed earlier." with the options to cancel or resend but neither results in the message "Hello World" from the script. If I click on the url in the bar at the top of firefox and then press enter instead of f5 (both should reload the webside), the expected message appears. At least I opened the .html file directly from firefox with the "Open File..." option and if I click on the submit button, the browser ask me if I want to download the login.php file.

I don't why I get these different behaviors and could not find other solutions on the internet. Can anyone help me?

EDIT: If I run the website via xampp no problem occur. But I still don't know why it won't work if I open the website out of xampp.

Answer 1

Did you try removing the "." from the /scripts/login/php?

<form action="/scripts/login.php" method="post">
  <input type="text" name="username" placeholder="Enter Username" autofocus>
  <input type="password" name="password" placeholder="Enter Password">
  <p>Forgot password?</p>
  <input type="submit" value="Confirm" name="submit_login">
</form>