jQuery Mobile 에서는 새로운 라인의 시작을 가리키기 위해 <div> element 에 ui-block-a CSS class 를 사용합니다. 이전에도 다뤘었구요.
Dynamic insertion of a new line in a table
<!DOCTYPE html>
<html>
<head>
<meta name=viewport content="user-scalable=no,width=device-width" />
<link rel=stylesheet href=jquery.mobile/jquery.mobile.css />
<script src=jquery.js></script>
<script src=jquery.mobile/jquery.mobile.js></script>
</head>
<body>
<div data-role=page id=home>
<div data-role=header>
<h1>Home</h1>
</div>
<div data-role=content>
<p> Window content </p>
<div id=table class=ui-grid-b>
<div class=ui-block-a>Element 1.1</div>
<div class=ui-block-b>Element 1.2</div>
<div class=ui-block-c id=insert>Element 1.3</div>
<div class=ui-block-a>Element 2.1</div>
<div class=ui-block-b>Element 2.2</div>
<div class=ui-block-c>Element 2.3</div>
</div>
</div>
</div>
</body>
</html>
<script>
var html = "<div class=ui-block-a> Element 1bis.1 </div>";
html += "<div class=ui-block-b> Element 1bis.2 </div>";
$("#insert").after (html);
</script>
tistory445_01.html
'jQuery Mobile > JQM Tutorial' 카테고리의 다른 글
| Ajax 로 input fields 삽입하기 (0) | 2012.11.07 |
|---|---|
| HTML element 를 jQuery Mobile 의 input field로 변환하기 (0) | 2012.11.07 |
| 다이나믹하게 input field 생성하기 (0) | 2012.11.07 |
| 테이블 manipulation 예제 (0) | 2012.11.06 |
| 테이블에서 이벤트 다루기 (0) | 2012.11.06 |
| 다이나믹하게 새로운 컬럼 insert 하기 (0) | 2012.11.06 |
| Ajax 로 테이블 삽입하기 (0) | 2012.11.06 |
| HTML element 를 jQuery Mobile table 로 변환하기 (0) | 2012.11.02 |
| 다이나믹하게 테이블 생성하기 (0) | 2012.11.02 |
| 버튼 관련 예제 파일 들 (0) | 2012.10.31 |