Question

我是JQuery Mobile的新手，我正在尝试列出元素及其属性。这是我的代码：

$(document).ready(function(){
              var text = '{"productes":[' +
              '{"Nom":"Lays","Tipus":"Patata","Categoria":"Aliments","PreuCompra":"0,35","PreuVenda":"1","Comprar":"S&iacute;","Vendre":"S&iacute;","UdM":"kg" },' +
              '{"Nom":"Magdalenes","Tipus":"Pasta","Categoria":"Aliment","PreuCompra":"1","PreuVenda":"1.25","Comprar":"No","Vendre":"S&iacute","UdM":"kg" },' +
              '{"Nom":"Espaguetis Gallina Blanca","Tipus":"Pasta","Categoria":"Aiment","PreuCompra":"0,40","PreuVenda":"1,30","Comprar":"S&iacute;","Vendre":"S&iacute","UdM":"gr" },' +
              '{"Nom":"Fairy","Tipus":"Rentabaixelles","Categoria":"Neteja","PreuCompra":"0,40","PreuVenda":"1,30","Comprar":"No","Vendre":"S&iacute;","UdM":"ml" }]}';


var obj = jQuery.parseJSON(text);
              for (var i=0; i<4; i++) {
        $("#llista").append("<div data-role='collapsible'> <h3>"+ obj.productes[i].Nom +"</h3> <p>Tipus: "+ obj.productes[i].Tipus + "<br>Categoria: " + obj.productes[i].Categoria +"<br>Preu compra: " + obj.productes[i].PreuCompra +"&euro;<br>Preu Venda: " + obj.productes[i].PreuVenda +"&euro;<br>Comprar: " + obj.productes[i].Comprar +"<br>Vendre: " + obj.productes[i].Vendre +"<br>UdM: " + obj.productes[i].UdM +"</p><button data-inline='true'>Eliminar</button><button data-inline='true'>Editar</button></div>");
    }
    $("#nou").click(function(){
         $("#llista").append("<div data-role='collapsible'> <h3>"+ obj.productes[0].Nom +"</h3> <p>Tipus: "+ obj.productes[0].Tipus + "<br>Categoria: " + obj.productes[0].Categoria +"<br>Preu compra: " + obj.productes[0].PreuCompra +"&euro;<br>Preu Venda: " + obj.productes[0].PreuVenda +"&euro;<br>Comprar: " + obj.productes[0].Comprar +"<br>Vendre: " + obj.productes[0].Vendre +"<br>UdM: " + obj.productes[0].UdM +"</p><button id='elim' data-inline='true'>Eliminar</button><button id='edit' data-inline='true'>Editar</button></div>");
    });

}）;

当我点击“Nou元素”（新元素）时。似乎风格消失了。我不明白

谢谢！

Answer 1

假设#llista是一个可折叠的div，只需在附加可折叠符后调用 .enhanceWithin() ：

$("#llista").append(...).enhanceWithin();

这指示jQM增强容器div的所有内容，包括新添加的项目。

也代替

$(document).ready(function(){...

使用jQM事件

$(document).on("pagecreate", "#pageid", function(){...

@Omar写了一篇关于页面事件的精彩文章，可以在这里找到：

http://jqmtricks.wordpress.com/2014/03/26/jquery-mobile-page-events/

如何添加元素，不要丢失de style

1 个答案: