Version 1 (modified by Jon Davis, 6 years ago) (diff)


DOM Input Events

Wenson Hsieh, Apple

  • input events fired when DOM mutates (editable elements)
    • events of type input
    • non-cancellable
  • new spec creates subclasses of input events that are cancellable
  • why?
    • pages may want to allow only a subset of rich editing commands
    • handle certain editing operations in a custom way
    • track edited text using a custom JS-based data model
      • what is shown/represented on the page
  • attribute DOMString inputType
    • insertRelacementText
    • insertFromPaste
    • insertCompositionText
    • deleteWordBackward
    • formatBold
  • attribute DOMString? data
    • some data attached to the event being fired
    • e.g. as the user types, the data field of the event is each newly inserted character
  • attribute DataTransfer? dataTransfer
    • only for rich editing elements
    • way to get HTML representation of contents being transferred
  • sequence<StaticRange> getTargetRanges()
    • range of text being modified by current input command
  • Demo of simple markdown editor
    • content is bold-able from context menu
    • maybe instead we edit the content to represent the intent of the action (wrap the text in “” for markdown bold)
    • take data that is copied/pasted and override what is shown
  • function handler for BeforeInput
    • check the different values for event.inputType and act accordingly
    • one handler for all types