javascript - 用 jquery 附加 html 但没有获得样式

Question

我正在向我的网页添加一些带有 js 的 li，为此我使用了一些 jquery 移动样式表: 为了加载 js，我使用以下代码:

$(document).bind('pageshow', function () {
    LoadLaadPalen.init();
}

然后将使用此代码:

var myData = [
    {"Identifier":1,"Naam":"NOT Given","Adres":"Kopenhagen 9","Postcode":"0000LL","Plaats":"NOT Given","Longitude":"0.00000","Latitude":"0.00000"},
    {"Identifier":2,"Naam":"NOT Given","Adres":"NOT Given 1","Postcode":"0000LL","Plaats":"Rotterdam","Longitude":"0.00000","Latitude":"0.00000"},
    {"Identifier":3,"Naam":"NOT Given","Adres":"NOT Given 6","Postcode":"0000LL","Plaats":"Rotterdam","Longitude":"0.00000","Latitude":"0.00000"},
    {"Identifier":4,"Naam":"NOT Given","Adres":"NOT Given 1","Postcode":"0000LL","Plaats":"Den Haag","Longitude":"0.00000","Latitude":"0.00000"},
    {"Identifier":5,"Naam":"NOT Given","Adres":"NOT Given 218","Postcode":"0000LL","Plaats":"Zoetermeer","Longitude":"0.00000","Latitude":"0.00000"}
];

$('.result').append("moi");

var items = [];
$.each(myData, function(index, element) {
    $('.greenfluxlist').append('<a href="#" rel="external"><li id="' + element.Identifier + '"><h3>' + element.Naam + '</h3><p>' + element.Adres +  '</p></li></a>');
});

并且必须将其附加到此部分:

<div data-role="content" data-theme="a">
    <div id="laadpalen">
        <p><strong>Op deze locaties zijn laadpunten aanwezig:</strong></p>
        <div class="result">
            <ul class="greenfluxlist" data-role="listview" data-inset="true"></ul>
        </div>
    </div>
</div>

但不幸的是我没有看到任何风格。我只看到带有文本和蓝色标准链接的项目符号。而且，如果我要检查源代码，没有任何 html li 代码，但在网页上我看到它们...

Answer 1

看看你的

定义。它应该以

:

开头

<li><a href="bmw.html">BMW</a></li>

您的格式不正确:

<a href="#" rel="external"><li id="' + element.Identifier + '"><h3>' + element.Naam + '</h3><p>' + element.Adres +  '</p></li></a>

尝试按照我向您展示的方式进行操作:

<li><a class=contact href="#" id="' + data.response[key].id + '" ><h1>' + data.response[key].label + '</h1><p>'+ data.response[key].customer + '</p></a></li>

以

开头，而不是 href :P 如果出现问题，请查看:jQuery docs 。记得触发然后刷新列表:

$('.greenfluxlist').trigger('create');
$('.greenfluxlist').listview('refresh');