title: HTML input that takes only numbers and the + symbol
body: <p>I am trying to build a custom text input for phone numbers that accepts only numbers and the plus (+) symbol; all other characters need to be discarded and not shown on the field.</p>
  
  <p>I am trying to do this using an event handler (onkeydown/onkeypress) and discarding inputs corresponding to other keys. However, I can't figure out a cross-browser way to do it. Here are the approaches that I have tried and don't work:</p>
  
  <ul>
  <li><p><strong>Using the onkeypress event and looking at event.key</strong> to figure out which key was pressed: doesn't work on Chrome (see <a href="http://caniuse.com/keyboardevent-key" rel="noreferrer">http://caniuse.com/keyboardevent-key</a>). Is there any cross-browser workaround?</p></li>
  <li><p><strong>Using the onkeycode event and looking at event.keyCode:</strong> does not work when we need to press multiple keys to print a character (for instance, an English keyboard layout requires pressing Shift and = to give +). Furthermore, it allows characters such as !@#$%ˆ&amp;*() to appear, as these appear when pressing Shift and a number. (This is the approach followed in <a href="https://stackoverflow.com/questions/5535449/javascript-keycode-allow-number-and-plus-symbol-only">JavaScript keycode allow number and plus symbol only</a>, but it does not help me much ;))</p></li>
  <li><p><strong>Using the HTML pattern attribute:</strong> this does not really seem to prevent people from writing whatever they feel like.</p></li>
  </ul>
  
  <p>Thanks!</p>