登錄

時間 2019-11-20
標籤登錄简体版
原文原文鏈接
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <!--ExtJs框架開始-->
    <script type="text/javascript" src="/Ext/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="/Ext/ext-all.js"></script>
    <link rel="stylesheet" type="text/css" href="/Ext/resources/css/ext-all.css" />
    <style type="text/css">
        .loginicon
        {
            background-image: url(image/login.gif) !important;
        }
    </style>
    <!--ExtJs框架結束-->
    <script type="text/javascript">
        Ext.onReady(function () {
            //初始化標籤中的Ext:Qtip屬性。
 Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; //提交按鈕處理方法
            var btnsubmitclick = function () { if (form.getForm().isValid()) { //一般發送到服務器端獲取返回值再進行處理，咱們在之後的教程中再講解表單與服務器的交互問題。
 Ext.Msg.alert("提示", "登錄成功!"); } } //重置按鈕"點擊時"處理方法
            var btnresetclick = function () { form.getForm().reset(); } //提交按鈕
            var btnsubmit = new Ext.Button({ text: '提 交', handler: btnsubmitclick }); //重置按鈕
            var btnreset = new Ext.Button({ text: '重 置', handler: btnresetclick }); //用戶名input
            var txtusername = new Ext.form.TextField({ width: 140, allowBlank: false, maxLength: 20, name: 'username', fieldLabel: '用戶名', blankText: '請輸入用戶名', maxLengthText: '用戶名不能超過20個字符' }); //密碼input
            var txtpassword = new Ext.form.TextField({ width: 140, allowBlank: false, maxLength: 20, inputType: 'password', name: 'password', fieldLabel: '密　碼', blankText: '請輸入密碼', maxLengthText: '密碼不能超過20個字符' }); //驗證碼input
            var txtcheckcode = new Ext.form.TextField({ fieldLabel: '驗證碼', id: 'checkcode', allowBlank: false, width: 76, blankText: '請輸入驗證碼！', maxLength: 4, maxLengthText: '驗證碼不能超過4個字符!' }); //表單
            var form = new Ext.form.FormPanel({ url: '******', labelAlign: 'right', labelWidth: 45, frame: true, cls: 'loginform', buttonAlign: 'center', bodyStyle: 'padding:6px 0px 0px 15px', items: [txtusername, txtpassword, txtcheckcode], buttons: [btnsubmit, btnreset] }); //窗體
            var win = new Ext.Window({ title: '用戶登錄', iconCls: 'loginicon', plain: true, width: 276, height: 174, resizable: false, shadow: true, modal: true, closable: false, animCollapse: true, items: form }); win.show(); //建立驗證碼
            var checkcode = Ext.getDom('checkcode'); var checkimage = Ext.get(checkcode.parentNode); checkimage.createChild({ tag: 'img', src: 'image/checkcode.gif', align: 'absbottom', style: 'padding-left:23px;cursor:pointer;' });
        });
    </script>
</head>
<body>
<!--
說明：
(1)88行，iconCls: 'loginicon':給窗體加上小圖標，樣式在第12行定義。
(2)Ext.getDom('checkcode')：根據ID獲取Dom。
(3)Ext.get(checkcode.parentNode)：根據Dom獲取父節點。
(4)checkimage.createChild()：建立子節點，標籤爲<img src='image/checkcode.gif'..../>。
(5)form.getForm().isValid()：校驗表單的驗證項是否所有經過。
(6)form.getForm().reset()：重置表單。
-->
</body>
</html>
http://www.cnblogs.com/iamlilinfeng/archive/2012/06/21/2558075.htmljavascript
相關標籤/搜索
每日一句
每一个你不满意的现在，都有一个你没有努力的曾经。