style-keypress-events.html 982 B

1234567891011121314151617181920212223242526272829303132333435363738
  1. <body onload="setup()">
  2. <p>cmd+b and cmd+i should generate a keydown event in contentEditable fields. Also, calling
  3. preventDefault() in the keydown event should cancel the text styling.</p>
  4. <div contentEditable id="test" style="border: 1px solid; padding: 4px;">
  5. This is some sample text.<br><br><br><br>
  6. </div>
  7. <div>
  8. <input type="checkbox" id="disable"><label for="disable">preventDefault() in keydown</label>
  9. </div>
  10. <div id="log"></div>
  11. <script>
  12. function setup()
  13. {
  14. var test = document.getElementById("test");
  15. test.addEventListener("keydown", keydown, false);
  16. var selection = window.getSelection();
  17. selection.setPosition(test, 0);
  18. selection.modify("extend", "forward", "sentence");
  19. test.focus();
  20. }
  21. function log(msg)
  22. {
  23. var log = document.getElementById("log");
  24. log.innerHTML += "<br>" + msg;
  25. }
  26. function keydown(event)
  27. {
  28. log("keydown");
  29. if (document.getElementById("disable").checked)
  30. event.preventDefault();
  31. }
  32. </script>
  33. </body>