Whiteship's Note

XQuared 사용하기 4

Good Tools : 2007.11.14 00:14


이번에는 XQuared API를 조금 살펴봤습니다. API 문서화를 매우 잘 해두었기 때문에, API만 보는 것으로도 많은 도움을 받을 수 있습니다.

var xed;

    window.onload = function() {
        xed = new xq.Editor($("xqEditor"));
        xed.setEditMode('wysiwyg');
        xed.loadStylesheet("css/xq_contents.css");
        xed.focus();
    }

위의 코드가 XQuared 11월 8일 배포판에 포함되어 있던 코드 입니다.

가장 중점적으로 살펴보아야 할 API는 Editor.js입니다. 이 곳에 위에서 사용한 모든 메소드들이 들어있습니다.

xed = new xq.Editor($("xqEditor"));

생성자를 사용했네요. 인자로 넘겨준 값은 다음과 같이 설명되어 있습니다.
HTML element(TEXTAREA or normal block element such as DIV) to be replaced with editable area.

Textarea 엘리먼트나 div와 같은 블럭 엘리먼트의 이름을 넘겨준다고 친절하게 설명되어 있습니다.

실제 위의 예제는 TextArea에서 다음과 같이 정의하고 있습니다.
<textarea name="contents" id="xqEditor"></textarea>

이렇게 하면 이 TextArea는 XQuared 에디터가 자리잡게 됩니다.

xed.setEditMode('wysiwyg');

에디트모드는 세 종류가 있습니다. HTML 소스, 편집모드, 참조모드.
HTML 소스편집 모드로 보려면 인자로 source.
편집모드는 위와 같이 wysisyg.
참조모드는 readonly. 입니다.

나머지 두 줄은 별다른 설명이 필요 없을 것 같습니다.
메소드 작명도 잘 해두신 것 같습니다.

'Good Tools' 카테고리의 다른 글

레몬펜 우왕ㅋ굿~  (12) 2007.12.06
Eclispe 미안해. 내 눈이 삐구였어.  (2) 2007.11.26
Java에 OpenID 적용 관련 아티클  (0) 2007.11.20
티스토리에서 코드 하이라이팅 사용하기  (6) 2007.11.14
Trang :: XML로 XSD 작성해 주는 도구  (0) 2007.11.14
XQuared 사용하기 4  (2) 2007.11.14
Eclipse TPTP 맛보기  (4) 2007.11.13
XQuared 사용하기 3  (4) 2007.11.08
XQuared 사용하기 2  (0) 2007.11.07
XQuared 사용하기  (0) 2007.11.05
외장 하드 포맷하기.  (0) 2007.11.03
top

  1. Favicon of http://yunsunghan.tistory.com BlogIcon Max 2007.11.14 09:12 PERM. MOD/DEL REPLY

    기선씨 블로그글 보고
    Xquared를 Demo에 붙여 보았는데, 기존에 Textarea 를 쉽게 전환해서 적용해볼수 있었습니다.
    단순히 적용만 해보았는데... 시간 되면 분석해볼만한 놈인것 같아요... ^^*

    Favicon of http://whiteship.tistory.com BlogIcon 기선 2007.11.14 11:58 PERM MOD/DEL

    넹. 저도 꾸준히 살펴볼 계획입니다. 기능확장과 단축키 추가 변경까지 해보는 것이 목표입니다.

Write a comment.