Web UI的快速开发

Question

我目前正在开发一个web应用程序，它将取代一些办公室的旧系统。(很老了，就像在FoxPro一样)

我目前的任务是开发一个非常像桌面的快速用户界面，意思是完全不使用鼠标，这样他们就可以相当快地捕获数据，而且几乎不用看一眼就能完成。

他们期望这样的事情：

使用箭头键导航，填充当前字段时跳到下一个字段，在一个字段中按enter键，然后显示一个包含数据的列表供他们选择(使用箭头键再次导航)等等。

我可以很容易地用javascript完成这个任务，但是由于我被要求帮助这个项目，因为完成这个项目的时间非常短，

--哪些库、控件或类似工具可以帮助我快速完成这一任务？

Answer 1

您还没有提到所需的浏览器支持类型。这个web应用程序听起来像是需要捕捉和处理相当多的键盘事件。

不同的浏览器处理事件的方式不同。所以，你需要记住这一点。

是的，提交自己的密钥处理Javascript相对简单，但使用免费的公共框架(如JQuery、Prototype或Dojo )肯定更好。与其建议一个而另一个( SO社区似乎对JQuery有一个特殊的软角落，请相信我！)，我会说，检查它们并自行决定。

您还可能希望查看预构建(商业或其他)自定义控件，这些控件提供所需的应用程序功能。例如，如果您需要一种电子表格类型的数据输入接口，那么许多控件都可以在web上使用。

Answer 2

用JQuery..。忘了跨浏览器的DOM处理。JQuery在VS.Net中有很大的支持。

Answer 3

为了节省一些时间，下面是“按下回车的下一个字段”的代码：(您需要JQuery tho)

$.fn.focusNextInputField = function() {
    return this.each(function() {
       var fields = $(this).parents('form:eq(0),body').find('button,input,textarea,select');
       var index = fields.index(this);
       if (index > -1 && (index + 1) < fields.length) {
          this.blur();
          fields.eq(index + 1).focus();
       }
       return false;
    });
};


$("button,input,textarea,select").keydown(function(event) {
    switch (event.keyCode) {
        case 13: $(this).focusNextInputField();
            break;
    }
});