No X's

Pair Programming - 20 min

You have a new client that despises the letter "x" with a passion. Make sure this text input prevents users from typing in the letter "x" as they type.

Tips:

Look through the list of DOM events and find one that will work for this situation
Remember the event object that's passed as the first argument into event handlers
Search for the list of key codes reported when a user presses a key on the webpage
Don't believe everything you see on the web. You might have to do some debugging with console.log()

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>No X's</title>
  <style type="text/css">
    h1 {
      text-align: center;
      font-family: Helvetica, sans-serif;
      margin-top: 5%;
    }

    #filtered-input {
      width: 90%;
      font-size: 175%;
      margin: 2% 5% 15% 7%;
      padding: 8px;
    }
  </style>
</head>
<body>
  <h1>No X's</h1>
  <form name="no-x-form" id="no-x-form">
    <input type="text" name="filtered-input" id="filtered-input">
  </form>
  
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script type="text/javascript">

  // Wait until the DOM is ready before proceeding
  $(function() {
  
    // Write your event handling code here


  });

  </script>
</body>
</html>

mdang/X.md

No X's