2013-12-15 4 views
0

내 웹 앱의 이상한 환경을 이해하는 데 도움이 필요합니다.Jquery Mobile 및 JSON

Phonegap 및 jQuery mobile을 사용하여 앱을 만들려고합니다. 목록보기의 새로 고침에 문제가 있습니다. JSON에서 데이터를 다운로드하고 요소 목록을 만듭니다.

목록이 올바르게 다운로드되거나 스타일이 지정되어 있지 않지만 브라우저를 새로 고침하면 올바르게 표시됩니다.

무엇이 문제입니까?

다음으로 HTML 및 자바 스크립트 페이지를 볼 수 있습니다.

HTML

<!DOCTYPE HTML> 
<html> 
<head> 
<title>CATEGORIA THRILLER</title> 
<meta name="viewport" content="width=device-width,initial-scale=1"/> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

<link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css" /> 
<link rel="stylesheet" href="css/jquery.mobile-1.3.2.css" /> 
<script src="js/jquery-1.10.2.js"></script> 
<script src="js/jquery.mobile-1.3.2.js"></script> 
</head> 
<body> 
<div id="thrillerListPage" data-role="page" data-theme="a"> 

<div data-role="header" data-position="fixed" data-theme="a"> 
<a href="index.html" data-icon="home" data-iconpos="notext"></a> 
<h1>THRILLER</h1> 
    </div> 
    <div data-role="content" data-theme="a"> 
     <ul id="thrillerList" data-role="listview" data-filter="true" data-theme="a"></ul> 
    </div>  
</div> 
<script src="js/libri-list.js"></script> 
<script src="js/libri-details.js"></script> 

</body> 
</html> 

JS

var serviceURL = "/services/"; 
var employees; 

$(document).ready (function() { 
getThrillerList(); 
}); 

$(document).delegate('#thrillerListPage','pageshow', function(event) { 
    getThrillerList(); 
}); 
$('#thrillerListPage').bind('pageinit', function(event) { 
    getThrillerList(); 
}); 

function getThrillerList() { 
    $.getJSON(serviceURL + 'get-lista-libri-thriller.php', function(data) { 
     $('#thrillerList li').remove(); 
     employees = data.items; 

     $.each(employees, function(index, employee) { 
      $('#thrillerList').append('<li><a href="libri-details.html?id=' + employee.id + '">' + 
        '<img src="employee.img + '" width="58px" height="80px" />' + 
        '<h4>' + employee.title + '</h4>' + 
        '<p>' + employee.info1 + '</p>' + 
        '</a></li>'); 
     }); 
     $('#thrillerList').listview('refresh'); 
    }); 
} 

희망 누군가가 나를 도울 수 있습니다!

감사합니다.

+0

왜'jquery.mobile-1.3.2.css'와'mobile-1.3.2.min.css'를로드하고 있습니까? – Omar

+0

# thrillerList.append()에 자바 스크립트 오류가 있습니다. 아래에 upadted 코드를 참조하십시오 – Ved

답변

0
function getThrillerList() { 
    $.getJSON(serviceURL + 'get-lista-libri-thriller.php', function(data) { 
    $('#thrillerList li').remove(); 
    employees = data.items; 
    $.each(employees, function(index, employee) { 
     $('#thrillerList').append('<li><a href="libri-details.html?id=' + employee.id + '"><img src="'+employee.img + '" width="58px" height="80px" /><h4>' + employee.title + '</h4><p>' + employee.info1 + '</p></a></li>'); 

    }); 
    $('#thrillerList').trigger('create'); 
    $('#thrillerList').listview('refresh'); 
    }); 
} 
+0

도와 줘서 고마워! 시도했지만 시도가 여전히 작동하지 않습니다. (수동으로 페이지를 새로 고쳐야 데이터가 표시됩니다. – Prova17