jQuery .keydown (), .keyup () ignorando "I", "B"

I've got a bit of code here, which works okay in TextMate's web preview, but Safari is doing something that I'm not sure how to get around...

$(document).ready(function(){

  $('*[contentEditable="true"]').focusin(function(){
    var _self = this;
    var isCtrl = false;
    // Bind events.
    $(window).keyup( function(e) {
      if(e.which==17 || e.which == 91) isCtrl=false;
    });
    $(window).keydown( function(e){
      if(e.which==17 || e.which == 91) isCtrl=true;
      if(isCtrl) {
        console.log(e.which);
        switch(e.which) {
          case 66:  doCommand('bold');
                    break;
          case 67:  doCommand('cut');    
                    break;
          case 73:  doCommand('italic'); 
                    break;
          case 86:  doCommand('paste');  
                    break;
          default:  break;
        }
        return false;
      }
    });
  }).focusout(function(){
    $(window).unbind();
  });
});

Cuando te control + i or comando + i is pressed, we should get an event to make the text in the contentEditable area italic. The problem is, while other standard ASCII/Alpha character will fire, B and I do not. Now, if I preventDefault(), still nothing.

I need a fresh pair of eyes on this. Can anyone else see a way around this that won't prevent me from typing still?

Editar To clarify, yes this works fine with other text input elements (<textarea>, <input>, etc.). It's specifically related to contentEditable.

También, trabaja para doCommand se incluye aquí:

doCommand = function(cmd) {
  document.execCommand(cmd, null, null);
}

preguntado el 27 de agosto de 11 a las 21:08

2 Respuestas

First, there's no need to detect modifier keys separately. You can find out from the keyup or keydown event whether the cmd or ctrl keys were held down using the event's ctrlKey y metaKey propiedades.

Segundo, en contenteditable elements, keyboard shortcuts for bold and italic commands are already built in by the browser.

It's certainly possible to intercept the keypresses you want. See http://jsfiddle.net/Hq43A/

Respondido 28 ago 11, 03:08

Good to know. Still doesn't answer my question - How can I intercept "b" or "i"? - Stslavik

@stslavik: There's nothing else obviously wrong with your code, and it's certainly possible to intercept ctrl-b and ctrl-i. - Tim Down

@stslavik: I've added a jsFiddle example to my answer. - Tim Down

Excellent. I was putting the preventDefault in a completely wrong place. Thanks! - Stslavik

You've got something wrong in your doCommand function.

Mira aquí and try it. You'll see it alerts "italic" on CTRL + I.

Try to put some alerts into your function(s), you'll see it will help you a lot when debugging.

Respondido 28 ago 11, 01:08

Good, but you've got an important change – This isn't on a <textarea>. It's something about the combination of contentEditable and the keydown event. When isCtrl == true it will register, for instance, "e" but not "i" or "b". - Stslavik

@stslavik: it is probably that problem. Try to change it to data-contenteditable and try again - génesis

change all "contentEditable" occurences to "data-contenteditable", because if i know correctly, contentEditable is not valid attr - génesis

contentEditable is accessible through jQuery as an (html5) attribute name. data-contenteditable gives no result. - Stslavik

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.