屏幕键盘上的纯Javascript问题

时间:2013-01-11 09:03:24

标签: javascript-events

我有一个屏幕键盘和5个输入框。我的问题是当我专注于输入框并输入内容时,什么都不会发生。我想在每次关注输入框时添加输入。

这是我的简单代码。此代码仅适用于1个输入字段。我想让这个工作为5或4个输入字段。

function writeKey(key){
  if(key){
    if(key == "Enter"){
      key = "10";
     } else if(key == "tab"){
      document.getElementById("feld1").value += "\t ";
    } else if(key=="backspace"){
      document.getElementById("feld1").value=document.getElementById("feld1").value.slice(0,-1);
    } else if(key==" "){
      document.getElementById("feld1").value += " ";
    } else {
      document.getElementById("feld1").value += String.fromCharCode(key);
    }
  }
}

2 个答案:

答案 0 :(得分:2)

查看指向当前焦点元素的document.activeElement

您可以使用它重写您的代码:

function writeKey(key){
  var el = document.activeElement;
  if(key){
    if(key == "Enter"){
      key = "10";
     } else if(key == "tab"){
      el.value += "\t ";
    } else if(key=="backspace"){
      el.value = el.value.slice(0,-1);
    } else if(key==" "){
      el.value += " ";
    } else {
      el.value += String.fromCharCode(key);
    }
  }
}

演示here

请注意,您应该运行writeKey而不是onclick但是onmousedown。否则焦点将从输入中移出。演示反映了这一点。

这是它的HTML代码:

<div onmousedown="writeKey('a');return false">Click key</div>
<input type="text" />
<input type="text" />
<input type="text" />

另外,在调用writeKey之后,请查看return false;。它将阻止默认浏览器操作并单击一个键,您不会从输入中失去焦点。没有它,您需要在每次按键后将焦点设置在元素上。

答案 1 :(得分:1)

我不知道您实际上是如何调用writeKey方法的。您可以像这样重写代码:

function writeKey(key, fieldId){
  if(key){
    if(key == "Enter"){
      key = "10";
     } else if(key == "tab"){
      document.getElementById(fieldId).value += "\t ";
    } else if(key=="backspace"){
      document.getElementById(fieldId).value =
          document.getElementById(fieldId).value.slice(0,-1);
    } else if(key==" "){
      document.getElementById(fieldId).value += " ";
    } else {
      document.getElementById(fieldId).value += String.fromCharCode(key);
    }
  }
}

或者你可以通过该档案:

function writeKey(key, field) {
    ...
    field.value += "\t";
    ...
}