Я программирую приложение в Phonegap, используя HTML (5), CSS3 и Javscript (и друзья). У меня проблема, хотя: синтаксический анализ XML работает отлично, я получаю все элементы в файле XML на своем экране и могу стилизовать их с помощью CSS.
Каждый элемент XML имеет заголовок, изображение, тизер и «lees-verder» («читать дальше», который в основном содержит только встроенное видео).
Это скрипт, который я использую для просмотра заголовка, изображения и тизера каждого элемента:
<script>
$(document).ready(function(){
$.ajax({
type: "GET",
url: "webzap.xml",
dataType: "xml",
success: function(xml) {
$(xml).find('item').each(function(){
var urllist = $(this).find('link').text();
var node = urllist.substring(urllist.lastIndexOf('-')+1);
var id = node;
var total = $(this).find('id').text();
var title = $(this).find('title').text();
var url = $(this).find('link').text();
var brief = $(this).find('teaser').text();
var long = $(this).find('lees-verder').text();
var pubDate = $(this).find('pubDate').text();
var img = $(this).find('image').text();
$('<a href="http://www.flabber.nl/node/'+id+'"><div class="items" id="link_'+id+'"></div></a>').appendTo('.class2');
$('<h2 class="title_list" style="margin-top: 40px;"></h2>').html(title).appendTo('#link_'+id);
$('<h6 class="pubDate"></h6>').html('Dit is node nummer '+id).appendTo('#link_'+id);
$('<div class="introtekst"></div>').html(brief).appendTo('#link_'+id);
$('<div class="introtekst"></div>').html(total).appendTo('#link_'+id);
$('<div class="screenshot"></div>').html('<img src="'+img+'" height="120"/><br />').appendTo('#link_'+id);
$('<h2 class="title"></h2>').html(title).appendTo('#link_'+id);
/*$('<div class="content"></div>').html(long).appendTo('#link_'+id); */
/*$('<div class="introtekst" id="link_'+id+'"></div>').html('<a href="'+url+'">Open volledige website</a>').appendTo('#link_'+id);*/
});
}
});
});
</script>
Что мне сейчас нужно, так это то, что я нажимаю на элемент, который затем открывается на новой странице и показывает заголовок, изображение, тизер И "lees-verder". Другая возможность может быть, если весь XML-контент исчезнет, когда пользователь нажимает на элемент, кроме элемента, на который он щелкнул. «Lee-verder» также должен быть загружен, потому что когда я просто скрываю его с помощью «display: none;» в CSS он все равно загружает их и резко тормозит приложение. Я, конечно, искал в Интернете, но не могу найти то, что мне нужно.
Вот фрагмент моего XML-файла, если вам будет намного легче. :)
<item>
<title>Wat is een schrikkeljaar?</title>
<link>
http://www.flabber.nl/linkdump/video/wat-is-een-schrikkeljaar-10653
</link>
<teaser>
<![CDATA[
Het is 29 februari, tijd om uit te leggen wat een schrikkeljaar is.
]]>
</teaser>
<lees-verder>
<![CDATA[
<p><iframe width="720" height="396" src="http://www.youtube.com/embed/xX96xng7sAE?rel=0" frameborder="0" allowfullscreen></iframe></p> <p>Check ook <a href="http://www.youtube.com/watch?v=53glKEPzElA">de video van MinutePhysics</a>.</p>
]]>
</lees-verder>
<image>
http://images.flabber.net/files/linkdump/schrikkeljaarwatishet.jpg
</image>
<pubDate>Wed, 29 Feb 2012 11:19:00 +0100</pubDate>
</item>
Спасибо большое заранее! Если у вас есть какие-либо вопросы или если я не был достаточно ясен, просто спросите, и я постараюсь уточнить!
ВАЖНО: Я не могу использовать PHP, так как Phonegap не поддерживает это. Допустимые языки: HTML (5), CSS (3) и Javascript (включая Jquery, Ajax и т. Д.)