onclick 이벤트 팝 업 login 로그 인 페이지
5319 단어 JavaScripteclipsecssstrutsext
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ taglib prefix="s" uri="/struts-tags"%>
<link href="css/style.css" rel="stylesheet" type="text/css"></link>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<div id="header">
<ul class="topNav">
<li class="home"><a href="Page.action?returnPage=index">Home</a></li>
<li class="pornstars"><a href="Page.action?returnPage=pornstar&word=AG">Pornstars</a></li>
<li class="members"><a href="#" id="member">Members</a></li>
<li class="signup"><a href="Page.action?returnPage=join">Signup</a></li>
</ul>
</div>
<div id="loginForm"></div>
<script>
function a()
{
var form1 = new Ext.form.FormPanel({
renderTo:"loginForm",
labelWidth: 75,
method:'POST',
title: '',
bodyStyle:'padding:20px 20px 0',
width: 300,
defaults: {width: 200},
defaultType: 'textfield',
onSubmit: Ext.emptyFn,
submit: function()
{
this.getEl().dom.action= 'openid.servlet';
this.getEl().dom.submit();
},
items: [{
fieldLabel: 'username',
id: 'username',
name: 'username',
allowBlank:false,
blankText : "username is not null",
width:150
},{
fieldLabel: 'password',
blankText : "password is not null",
id: 'password',
name: 'password',
allowBlank:false,
width:150,
inputType:'password'
}
],
buttons: [{
text: 'login',
type:'button',
id:'login',
handler: function()
{
if (form1.form.isValid())
{
form1.form.submit();
}
}
},{
text: 'reset',
type:'reset',
id:'clear',
handler: function()
{
form1.form.reset();
}
}
]
});
var window = new Ext.Window({
maximizable:true,
minimizable:true,
closable:true,
modal:true,
plain:true,
resizable:false,
title: 'login dialog',
width: 300,
height:180,
layout: 'fit',
bodyStyle:'padding:5px;',
buttonAlign:'center',
items: form1
});
window.show();
}
Ext.onReady(function(){
Ext.get("member").on("click",a);
});
</script>
위 에는 'members' 를 누 르 고 있 습 니 다. 링크 후 window 를 꺼 내 는 dialog 는 이 window 에 formpanel 이 추가 되 어 있어 서 제 가 원 하 는 효 과 를 얻 을 수 있 습 니 다.
그리고 한 가지 스 포 일 러: 내 가 처음에 extjs 를 공 부 했 을 때 그 세 개의 파일 만 페이지 에 가 져 왔 는데,
그 당시 에 이 세 개의 파일 ext - all. css, ext - base. js 와 ext - all. js 를 eclipse 의 extjs 디 렉 터 리 아래 에 놓 고 개발 하기 시 작 했 습 니 다. 그러나 위 에서 문 제 를 해결 할 때 팝 업 할 그 window 창 은 '최대 화', '닫 기', '최소 화' 아이콘 이 없 었 습 니 다. 그 당시 에 저 는 많은 글 을 찾 아 보 았 지만 이 유 를 찾 지 못 했 습 니 다.결 과 는 이 렇 습 니 다. 이것 은 실제로 페이지 에 표시 되 었 지만 보이 지 않 습 니 다. 마우스 로 맨 오른쪽 을 클릭 하면 이런 기능 이 있 습 니 다. 그래서 마지막 이 유 는 스타일 의 문제 입 니 다. 제 가 다른 스타일 을 도입 하지 않 았 기 때 문 입 니 다.그래서 마지막 으로 extjs 3.0 디 렉 터 리 아래 의 resources 의 모든 것 을 그 extjs 의 eclipse 디 렉 터 리 아래 에 시험 하면 결 과 는 정상적으로 나타 날 수 있 습 니 다.하하!드디어 끝났어.다음은 정확 한 코드 입 니 다: < link rel = "stylesheet" type = "text / css" href = "extjs / resources / css / ext - all. css" / >
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
기초 정리 - 1문자 (String) 숫자 (Number) 불린 (Boolean) null undefined 심볼 (Symbol) 큰정수 (BigInt) 따옴표로 묶어 있어야 함 Not-A-Number - 숫자 데이터 / 숫자로 표...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.