jEasyUI로 간단한 창 만들기


창을 만드는 것은 매우 간단합니다. DIV 태그를 만듭니다. 

<div id="win" class="easyui-window" title="My Window" style="width:300px;height:100px;padding:5px;">
	Some Content.</div>

이제 테스트 페이지를 실행하면 화면에 창이 표시됩니다. 우리는 자바스크립트 코드를 작성할 필요가 없습니다.

90.png

숨겨진 창을 생성하려면 'closed' 속성을 'true' 값으로 설정해야 합니다. 'open' 메서드를 호출하여 창을 열 수 있습니다. 

<div id="win" class="easyui-window" title="My Window" closed="true" style="width:300px;height:100px;padding:5px;">
	Some Content.</div>
$('#win').window('open');

마지막 예시 데모로, 로그인 창(창) 만들기: 

<div id="win" class="easyui-window" title="Login" style="width:300px;height:180px;"><form style="padding:10px 20px 10px 40px;"><p>Name: <input type="text"></p><p>Pass: <input type="password"></p><div style="padding:5px;text-align:center;"><a href="#" class="easyui-linkbutton" icon="icon-ok">Ok</a><a href="#" class="easyui-linkbutton" icon="icon-cancel">Cancel</a></div></form></div>
91.png

jQuery EasyUI 인스턴스 다운로드

jeasyui-win-win1.zip