Question

我有一个文本框，我使用keyUp事件对文本进行数据验证。当按下'enter'，'Arrow Dn'等键时，我的验证工作正常。我无法捕获的唯一键是'TAB'键。它的键码是09，但事件处理程序不发送键码，只是'N / A'。他们是否可以捕获'TAB'键？

....
var textClient = app.createTextBox().setId('txtClient')
                                    .setName('txtClient')
                                    .setSize('200px', '25px')
                                    .setStyleAttributes(styleTEXT14)
                                    .addKeyUpHandler(app.createServerKeyHandler('keyUpClient'))
                                    .addClickHandler(app.createServerHandler('clickClient'));
panelMain.Add(textClient, x, y);
....


function keyUpClient(e) {
  var app = UiApp.getActiveApplication();
  var key = e.parameter.keyCode;
  var boxData = e.parameter.txtClient; 
  Logger.log(key);
....
  return app;
}

Answer 1

如果您将相同的keyUpHandler添加到下一个小部件，那么即使您使用“TAB”键，也会获得按键值，这是一个适用于第一个textBox的示例：

在线测试here （奇怪的是，这不适用于我的Android平板电脑，不知道为什么......但适用于Chrome，Firefox和Safari）

function doGet() {
  var app = UiApp.createApplication().setTitle('test');
  var panel = app.createVerticalPanel();
  var keyUpHandler = app.createServerKeyHandler('keyUpClient');
  var textClient = app.createTextBox().setId('txtClient').setName('txtClient').addKeyUpHandler(keyUpHandler)
                                    .addClickHandler(app.createServerHandler('clickClient').addCallbackElement(panel));
  var text2 = app.createTextBox().addKeyUpHandler(keyUpHandler);
  app.add(panel.add(textClient)).add(text2);
  return app
}


function keyUpClient(e) {
  var app = UiApp.getActiveApplication();
  var key = e.parameter.keyCode;
  var boxData = e.parameter.txtClient; 
  app.add(app.createLabel('You pressed the key with code '+key));
  return app;
}

function clickClient(e){
  var app = UiApp.getActiveApplication();

  return app;
}

编辑：代码中有一个小问题，我没有立即注意到：当按下tab键时处理程序的来源不是第一个textBox而是第二个，这在某种程度上确实是合乎逻辑的.. 。因此，如果这是您的用例的问题，这里是我在演示应用程序上测试的解决方法，并且可行。（使用以下修改后的代码更新在线应用程序）

function doGet() {
  var app = UiApp.createApplication().setTitle('test');
  var panel = app.createVerticalPanel();
  var keyUpHandler = app.createServerKeyHandler('keyUpClient');
  var textClient = app.createTextBox().setId('textBox1').setName('textBox1').addKeyUpHandler(keyUpHandler)
                                    .addClickHandler(app.createServerHandler('clickClient').addCallbackElement(panel));
  var text2 = app.createTextBox().addKeyUpHandler(keyUpHandler).setId('textBox2');
  app.add(panel.add(textClient)).add(text2);
  return app
}


function keyUpClient(e) {
  var app = UiApp.getActiveApplication();
  var key = e.parameter.keyCode;
  var boxData = e.parameter.textBox1; 
  var source = e.parameter.source;
  if(source=='textBox2'&& key=='9'){source='textBox1'}
  app.add(app.createLabel('You pressed the key with code '+key+' in textBox '+source));
  return app;
}

如何在文本框上添加键加事件以捕获用户的“选项卡”输入

1 个答案: