11

I'm trying to set up a keyboard for a foreign language. I'm using jQuery to convert keys pressed into foreign characters. I am using:

  • A - Z
  • ALT + A - Z
  • SHIFT + A - Z
  • ALT + SHIFT + A - Z

    My code works for all of these except these 4:

    • ALT + I
    • ALT + U
    • ALT + E
    • ALT + N

It works fine in Firefox, but in Chrome and Safari (I'm using a mac) I get these accent marks - ˆ, ¨, ´, ˜ - instead of the foreign character that is supposed to go into the textarea.

Here is some of the code:

function type(e, char, textArea) {
    e.preventDefault();
    var start = textArea[0].selectionStart;
    var end = textArea[0].selectionEnd;
    var len = textArea.val().length;
    var newPos = start + char.length;
    textArea.val(textArea.val().substring(0, start) + char + textArea.val().substring(end, len));
    textArea[0].setSelectionRange(newPos, newPos);
}
$('textarea').keydown(function(e) {
        var textArea = $(this);
        if (e.which == 65 && e.altKey) {type(e, 'अ', textArea);return false;}
        if (e.which == 68 && e.altKey) {type(e, 'ड', textArea);return false;}
        if (e.which == 73 && e.altKey) {type(e, 'इ', textArea);return false;}
        if (e.which == 74 && e.altKey) {type(e, 'ज्ञ', textArea);return false;}
});

This works when e.which is 65, 68, and 74, but not 73.
How can I get this to work right?

4
  • 6
    FYI, return false is the same as e.preventDefault() and e.stopPropagation() together.
    – VisioN
    Commented Apr 19, 2016 at 12:08
  • could you do a console.log of e.which and check what it shows when doing [ALT] + [I] ? Using this JSFiddle, it works on chrome for me (Windows 10)
    – Jordumus
    Commented Apr 19, 2016 at 12:38
  • @Jordumus: On your JSFiddle, I get 18 + 229. Thats the same code I get for [ALT] + [u], [ALT] + [e], & [ALT] + [n].
    – twharmon
    Commented Apr 20, 2016 at 5:07
  • 2
    I've change it a little bit it works fine in chrome. here's my fiddle. Commented May 4, 2016 at 5:55

2 Answers 2

1

You know it's funny, I'm also constantly asking myself why something doesn't work in chrome even though it works just fine everywhere else. In this case, I'm assuming it has to do with the fact that both e.which and e.keyCode have been depreciated for e.key and e.code.

That being noted, I still use e.keyCode in production, so I know it still works with the latest version of chrome. Maybe do some console.log(e) and see what values are actually being returned?

I don't have chrome on my personal computer, so I can't test this, but I simplified your code and made a fiddle that works on my machine. Hopefully it helps point you in the right direction.

function InsertSymbol(symbol, $selector) {
  let cursor = $selector[0].selectionStart,
      text = $selector.val();
      
  $selector.val(text.substr(0, cursor) + symbol + text.substr(cursor)).focus()[0].setSelectionRange(++cursor, cursor);
}

$('textarea').on('keydown', function(e) {
  if (e.altKey) {
    e.preventDefault();
    
    switch (e.keyCode) {
      case 69: InsertSymbol('इ', $(this)); break;
      case 73: InsertSymbol('अ', $(this)); break;
      case 78: InsertSymbol('ज्ञ', $(this)); break;
      case 85: InsertSymbol('ड', $(this)); break;
    }
  }
});

https://jsfiddle.net/rvgj35kt/2/

0

I'm using Chrome on Mac and your jsFiddle example https://jsfiddle.net/s0fmpgaj/ is working. When I press ALT + SHIFT + i It returns the special char you defined.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.