原來用extjs 3做過登錄框，但是extjs 4對與鍵盤事件有些不大一樣了，在舊版本中通過“keys”實現按“Enter”登錄，在extjs 4中就不可以這樣子做了。習慣性貼出代碼：

?

?

?1?????????Ext.onReady(function?()?{
?2?????????????Ext.tip.QuickTipManager.init();
?3?????????????var?loginForm?=?Ext.widget('form',?{
?4?????????????????title:?'用戶登錄',
?5?????????????????labelWidth:?60,
?6?????????????????monitorValid:?true,
?7?????????????????frame:?true,
?8?????????????????bodyStyle:?'padding:5px?5px?0',
?9?????????????????width:?300,
10?????????????????url:?'/account/logon',
11?????????????????defaults:?{
12?????????????????????anchor:?'100%',
13?????????????????????allowBlank:?false,
14?????????????????????msgTarget:?'side',
15?????????????????????labelWidth:?60
16?????????????????},
17?????????????????defaultType:?'textfield',
18?????????????????renderTo:?'login',
19?????????????????items:?[{
20?????????????????????fieldLabel:?'用戶名',
21?????????????????????name:?'userName',
22?????????????????????allowBlank:?false
23?????????????????},?{
24?????????????????????fieldLabel:?'密碼',
25?????????????????????inputType:?'password',
26?????????????????????name:?'password',
27?????????????????????allowBlank:?false,
28?????????????????????enableKeyEvents:?true,
29?????????????????????listeners:?{
30?????????????????????????specialkey:?function?(fied,?e)?{
31?????????????????????????????if?(e.getKey()?==?e.ENTER)?{
32?????????????????????????????????loginForm.onLogin();
33?????????????????????????????}
34?????????????????????????}
35?????????????????????}
36?????????????????}],
37?????????????????buttons:?[{
38?????????????????????text:?'登錄',
39?????????????????????formBind:?true,
40?????????????????????handler:?function?()?{
41?????????????????????????loginForm.onLogin();
42?????????????????????}
43?????????????????},?{
44?????????????????????text:?'重置',
45?????????????????????handler:?function?()?{
46?????????????????????????this.up('form').getForm().reset();
47?????????????????????}
48?????????????????}],
49?????????????????onLogin:?function?()?{
50?????????????????????var?form?=?loginForm.getForm();
51?
52?????????????????????if?(form.isValid())?{
53?????????????????????????form.submit({
54?????????????????????????????waitTitle:?'用戶登錄',
55?????????????????????????????waitMsg:?'正在登錄',
56?????????????????????????????success:?function?(form,?action)?{
57?????????????????????????????????loginForm.setVisible(false);
58?????????????????????????????????window.location?=?'@ViewBag.ReturnUrl';
59?????????????????????????????},
60?????????????????????????????failure:?function?(form,?action)?{
61?????????????????????????????????Ext.Msg.alert('用戶登錄',?'登錄失敗');
62?????????????????????????????}
63?????????????????????????});
64?????????????????????}
65?????????????????}
66?????????????});
67?????????});

?

轉載于:https://www.cnblogs.com/TerryLiang/archive/2011/09/04/2166541.html

總結

以上是生活随笔為你收集整理的用extjs4做个登录框的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。