Ajax无法运行php文件

Question

I used similar code like below to show database tables. It was working then but now it's not working. I have tried many other codes but my post file is not called no matter what I do.

<div class="loginform-in">
  <h1>User Login</h1>
  <div class="err" id="add_err"></div>
  <fieldset>
    <form action="./" method="post">
      <ul>
        <li>
          <label for="name">Username </label>
          <input type="text" size="30"  name="name" id="name" />
        </li>
        <li> 
          <label for="name">Password</label>
          <input type="password" size="30"  name="word" id="word" />
        </li>
        <li> 
          <label></label>
          <button id="login" type="button" class="btn btn-default" onclick="saveBasics();">Login</button>
      </ul>
    </form> 
  </fieldset>
</div>

<script src="jquery-2.2.3.min.js"></script>
<script src="login.js"></script>

login.js

alert("hi");

$("#login").click(function(){   
  username = $("#name").val();
  password = $("#word").val();

  $.ajax({
    url: "login.php",
    type: "POST",
    data: "name=" + username + "&pwd=" + password,
    success: function(html) { 
      aler(html);
      if (html == 'true') {
        window.location = "login.php";
      } else {
        $("#add_err").css('display', 'inline', 'important');
        $("#add_err").html("<img src='images/alert.png' />Wrong username or 
password");
      }
    },
    beforeSend: function() {
      $("#add_err").css('display', 'inline', 'important');
      $("#add_err").html("<img src='images/ajax-loader.gif' /> Loading...")
    }
  });
  return false;
});

login.php

<?php
  echo '<script language="javascript">';
  echo 'alert("message successfully sent")';
  echo '</script>';
?>

My code is not running login.php file and I don't know why. It should show alert when button is clicked but it doesn't.

Note: I just added alert(html); in my java script file and the alert shows

    <script language="javascript">alert("message successfully sent")
    </script>true

this

Edited: Every body The javascript is working fine (I think) its just that the response I am getting is the literal php page code.

Answer 1

Open browsers console (F12) and see what errors are you getting?

Also, there is a Network tab.

If you will filter the XHR in the Network tab - then you will see, if your request is actually addressing the login.php page and you can see what the page has answered (the Response sub-tab).

Usually, I use more convenient way to fire ajax requests:

$.post('login.php', {
    name: $('#name').val(),
    pwd: $('#word').val(),
}, function(response) {
    console.log(response);
    alert(response); 
});