2

I'm using Cordova 3.6.4 in Visual Studio 2013 Community Update 4 to build an apps with a "chat" functionality, the main reason that I use this technology is because I want to, hopefully, write once and can use it in all platforms such as Android phones, iPhones, all mobile phone browsers, all desktop browsers.

In order to let the users inputting the "message" to be sent, I create a [div] which is contenteditable="true" at the bottom left of the html, at the right hand side of this [div], I have two [image buttons], one is the [happy face] button, the other is the [send button]. (You know, just like Whatsapp, Line and WeChat!)

At any time the user can click the [happy face] button to select one of the many "face image" to insert into the cursor at the [div], then I'll add the html codes into the [div], e.g. div.innerHTML += '< img src="1.jpg">'

So, the innerHTML of this [div] can contain characters AND images, e.g.

12< img src="1.jpg" />34< img src="2.jpg" />

Of course, the actual display is:

12[1st Picture]34[2nd Picture]

If the cursor is at the end of this [div], and I clicked the [BACKSPACE], I expect the [2nd Picture] will be removed, if I clicked the [BACKSPACE] again, I expect the letter [4] will be removed from the [div], this is work at ALMOST every platform I mentioned including all mobile browsers in android and iphone/ipad, all desktop browsers. But it does not work when I build an Android app and run it in any Android phone.

Running it as a WebView in android phone, when I click the the [BACKSPACE], the letter [4] is removed instead of the [2nd Picture], when I click the [BACKSPACE] again, the letter[3] is removed. I can NEVER remove the 2 images no matter which IME I'm using.

To work around, I tried to add a keyup/keydown/keypress listener to the [BACKSPACE] but it never fires.

At last, to work around this [BUG], I need to add a third [X] image button and use JavaScript string.replace to remove the < img> tag when users click this [X] button, but it looks very stupid to the users!

It makes me crazy that ALL IMEs do not remove the image for me by pressing the [BACKSPACE], and if the key events are not fired, I cannot remove the images myself!

I tried ALMOST, I think, ALL the suggestions provided by stackoverflow but they don't work at all, either not applicable to CORDOVA, or with compilation error such as [command failed with exit code 8] in Visual Studio.

What should I do?

halfer
  • 19,824
  • 17
  • 99
  • 186
Kenneth Li
  • 1,632
  • 1
  • 14
  • 19
  • You could refer the below two links in Stackoverflow: http://stackoverflow.com/questions/14560344/android-backspace-in-webview-baseinputconnection http://stackoverflow.com/questions/16499178/cant-get-backspace-to-work-in-codemirror-under-phonegap-on-android-4-x Hope, it will give you some hints. Recently, I met the same problems as you, with the above links help, I solve this problem. – jawee Jan 01 '17 at 10:43

0 Answers0