title: Will jQuery or AJAX make HTML "required" attribute invalid?
body: <p>I'm now constructing a registration page and have labeled username and password inputs as required. Simple code as:</p>
  
  <pre class="lang-html prettyprint-override"><code>Username &lt;input id="username" type="text" required/&gt;
  Password &lt;input id="username" type="password" required/&gt;
  &lt;button id="register"&gt;Register&lt;/button&gt;
  &lt;div id="registerOutput&gt;&lt;/div&gt;
  </code></pre>
  
  <p>When I just run those code with pure HTML on localhost the "required" would function properly. But once I include a register.js file which I made to get the data and use AJAX to send data to register.php, the required attribute seems not working. In register.js, simple code as:</p>
  
  <pre><code>$(document).ready(function(){
      $("#register").on("click", function(){
  
          var username        = $("#username").val();
          var password        = $("#password").val();
  
          var userData = "username=" + username + "&amp;password=" + password;
  
          $.ajax({
              method: "post",
              url: "register.php?",
              data: userData,
              success: function(backData){
                  $("#registerOutput").html(backData);
              }
          });
      });
  });
  </code></pre>
  
  <p>Can anybody tell me the reason why jQuery would override the functionality of required? How to surpass it or if it must override, how should I do the same thing in my jQuery code?</p>