• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Virtual Keyboard in HTML5: Insert or Remove Text Based on Cursor Position in Input Box

Community Beginner ,
Aug 24, 2023 Aug 24, 2023

Copy link to clipboard

Copied

I created a virtual keyboard in Adobe Animate as a part of a point-and-click text game. Clicking on the buttons on this keyboard will fill in a text input field (instance name: 'UserAnswerBox') or delete text from the input field. The code for these is as follows, but very speicifcally, it modifies the last element of the answer box:

 

//code inserting the letter a
this.A_btn.addEventListener('click',() =>{
document.getElementById('UserAnswerBox').value+='\u0061'
})

//code deleting the last letter

this.backspace_btn.addEventListener('click',() =>{
document.getElementById('UserAnswerBox').value=document.getElementById('UserAnswerBox').value.substring(document.getElementById('UserAnswerBox').value, document.getElementById('UserAnswerBox').value.length - 1)
})

 

I am looking for a way in Animate to modify the code so that virtual keyboard can allow letters to be inserted or deleted wherever the cursor currently is in the answer box. I wanted this because it will probably make more sense to users if the real keyboard and the virtual keyboard insert and delete text in the same way.

Views

42

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
no replies

Have something to add?

Join the conversation