当我聚焦在文本框上时，如何显示大写，Shift,Enter按钮

Question

我使用javascript为虚拟键盘编写了以下代码。

Jsp页面:

   <form>
        <label for="text">Enter Text: </label>
        <input id="text" name="text" type="text" size="50" onfocus="myFunction(this)" />
        <input name="" type="reset" value="Clear" />
     </form>

Javascript:

 function myFunction(x)
    {                    
    }
    function clicked(val)
    {   
        var txt;
        txt = document.getElementById('text').value;
        if(val != 'B')
        {
            txt = txt + '' + val;
        }
        else
        {
            txt = txt.substr(0,(txt.length)-1);
        }
        document.getElementById('text').value = txt;
    }
 $(".dialog").dialog({
        autoOpen: false,
        height: 200,
        width: 930,
        modal: false,
        draggable: true,
        resizable: true,
        buttons : {
                        "ESC":function(){
                var val="Esc";
                clicked(val);
            },
            "1":function(){
                var val="1";
                clicked(val);
            },
            "Tab":function(){
                var val="T";
                clicked(val);
            },
            "Caps":function(){
                var val="q";
                clicked(val);
            },


            "Shift":function(){
                var val="";
                clicked(val);
            },
            "B":function(){
                var val=" ";
                clicked(val);
            },


        },
});

当文本框聚焦时，显示像键盘一样的对话框，当我点击某些按钮时，它在文本框中输入的按钮值除了Caps,Shift,Enter和Tab。

请提供这些大写，Shift,Enter,Tab所需的代码。

我不确定如何在单击(val)方法中维护代码。

Answer 1

当用户按下shift/caps时，最好设置一个标志，而不是在文本框中插入任何东西。例如:

"Shift":function(){
                isShift=1;
            }
"Caps":function(){
                isCap=1;
            },

当插入一个字母时，检查标志。如果设置了isShift或isCap，则插入大写字母。isShift也应设置为0。

这只是PoC代码，你会知道如何实现它。