기본코드

HTML의 Anchor 태그를 이용하여 링크 기능을 사용할 수 있다.

Ajax를 사용하는 링크

Ajax 방식의 링크를 이용하면 다양한 화면전환 효과가 자동으로 적용된다. Ajax 방식의 링크를 사용하면 이동한 페이지 헤더 부분의 Javascript, CSS 효과가 적용되지 않을 수 있기 때문에 Javascript, CSS를 페이지를 불러들이는 Page에 정의해야한다.

페이지 내부링크

data-role 속성 값이 page 인 <div data-role="page"> Tag에 id 속성을 부여하여 페이지를 구분한다. href 속성에 '#[페이지 id]' 값을 부여하여 해당 id를 갖는 페이지로의 링크가 가능하다. 또한 내부링크를 Page를 호출 하는 링크는 rel="external" or data-ajax="false"를 이용하여 페이지 내부링크 페이지를 호출해야한다.

도메인 내부링크

동일한 도메인 내의 페이지로 링크를 걸어 이동한다.

다이얼로그 링크

data-rel="dialog" 속성을 추가하여 다이얼로그 형태로 링크를 실행한다.

Ajax를 사용하지 않는 링크

Ajax 방식을 사용하지 않는 링크는 페이지 전체를 Refresh 한다. Ajax 방식을 사용하지 않으면 화면효과가 적용되지 않지만 헤더 부분의 Javascript, CSS 를 적용할 수 있다.

외부 링크

외부 도메인의 사이트로 링크를 걸어 이동한다.

data-ajax="false" 속성추가

data-ajax="false" 속성을 추가하여 Ajax 효과 없이 페이지를 이동한다.

rel="external" 속성추가

rel="external" 속성을 추가하면 Ajax 효과 없이 페이지를 이동한다.

target 속성추가

target 속성을 추가하면 Ajax 효과 없이 새로운 브라우저 창으로 이동한다.

링크버튼

data-role="button" 속성을 추가하여 링크를 버튼 형태로 표시한다.

에러 메시지 표시

해당 페이지로 이동이 불가한 경우 자동으로 에러 메시지를 표시한다.

메일 연동 링크

href 속성 값으로 mailto:[메일주소]를 추가하면 링크를 통해 자동으로 메일기능을 실행한다.

href 속성 값으로 mailto:[메일주소]를 추가한후 cc="[메일주소]"를 통해 참조, bcc="[숨은 참조]", subject="[제목]", body="[내용]" 을 추가 하면 다양한 형식으로 메일 연동을 할 수 있다.

통화 연동 링크

href 속성 값으로 tel:[전화번호]를 추가하면 링크를 통해 자동으로 휴대폰의 통화기능을 실행한다.