2012-03-16 3 views
0

모두. 나는 ajax와 jquery-mobile loading 질문을 가지고있다.ajax + jquery mobile을 사용하여 html 요소 추가하기

api = 
    update: -> 
    console.log "updated" 
    $.ajax 
     dataType: "jsonp" 
     url: "http://localhost:3004/videos.json" 
     success: (data) => 
     if data 
      data.forEach (elem) => 
      video_id = elem.video_id 
      embed_id = elem._id 
      $("#play_list").append " 
      <ul data-role='listview' data-theme='a'> 
       <li>hello</li> 
       </ul> 
      " 
    t = api.update() 

그리고이 코드를 html 파일에 삽입하려고합니다.

<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet"/> 
    <link href="bootstrap/css/bootstrap.responsive.css" rel="stylesheet"/> 
    <body> 
    <div id="play_list"></div> 
    </body> 
<script> 
head.js(
"lib/jquery.js", 
"lib/jquery.mobile-1.0.1.min.js", 
"http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.1.6/underscore-min.js", 
"http://cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js", 
"http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.1/backbone-min.js", 
    "app.js" 
); 
</script> 
</html> 

출력 HTML 코드는

<ul data-role='listview' data-theme='a'> 
<li>hello</li> 
</ul> 

입니다 그러나 그것은 JQuery와 모바일 스타일로 포맷하지 않습니다. 그냥 일반적인 HTML 스타일을 출력합니다. 다음 그림과 같이 출력하고 싶습니다. http://brooky.cc/wp-content/uploads/2011/04/list_view1.png

도와주세요. 사전에

감사합니다. fine manual에서

답변

1

:

그냥 jQuery 플러그인처럼,

당신이 직접 선택에서 목록보기 플러그인을 호출 할 수있는 플러그인 목록보기 전화 :

$('#mylist').listview(); 

을 라이브러리는에있는 모든 목록에서 listview()로 자동으로 호출됩니다. 페이지가 일을 시작할 때, AFAIK는 기본적으로이 수행합니다 새 목록을 추가하는 경우

$('[data-role=listview]').listview(); 

, 당신은 단지 .listview() 할 필요가 그것을 :

success: (data) => 
    if data 
    data.forEach (elem) => 
     video_id = elem.video_id 
     embed_id = elem._id 
     ul = $(" 
     <ul data-role='listview' data-theme='a'> 
      <li>hello</li> 
     </ul> 
     ") 
     $("#play_list").append ul 
     ul.listview() 

데모 : http://jsfiddle.net/ambiguous/pMF4G/

당신은 할 수 한 번에 모두 추가하십시오.

success: (data) => 
    if data 
    uls = $() 
    data.forEach (elem) => 
     video_id = elem.video_id 
     embed_id = elem._id 
     uls = uls.push(" 
     <ul data-role='listview' data-theme='a'> 
      <li>hello</li> 
     </ul> 
     ") 
    $("#play_list").append uls 
    uls.listview() 

데모 : http://jsfiddle.net/ambiguous/BdqeC/

+0

고마워! 그것은 작동합니다. :) – nobinobiru

관련 문제