如何在jQuery中动态生成可折叠集

How to dynamically generate collapsible-set in jQuery?

本文关键字:可折叠 动态 jQuery      更新时间:2023-09-26

我从 php 文件中检索一些标题数据(主标题,每个标题都有子标题(。

我收到的数据工作正常,但是当我想在jquery(移动(中生成可折叠集时,它没有显示美丽的主题......只是纯文本?!

这是我的 HTML 文件:

<div data-role="collapsible-set" data-content-theme="d" id="headlinegroup">

这是我的javascript文件:

$.ajax({
   type: "POST",
   url: "headline_getter.php",
   dataType: 'json',
   cache: false,
   success: function(data1){
   console.log ("debug 2");
   var i = 0;
   var $elements = '';
   $.each(data1[i].main, function() {
          console.log ("debug 3 ");
          $elements += ($('div[data-role=collapsible-set]#headlinegroup').append('<div data-role="collapsible"><h3>' + data1[i].main + '</h3><div data-role="fieldcontain"><fieldset data-role="controlgroup" id="headlinegroup'+[i]+'">'));
          var j = 0;
          $.each(data1[i].sub, function() {
                 console.log ("debug 4");
                 $elements += ('<label><input type="checkbox" name="headlines[]" data-mini="true" value="' + data1[i].mid[j] + '"/>' + data1[i].sub[j] + '</label>');
                 j++;
                 });
        $elements += ('</fieldset></div></div>');
        $elements.collapsible();
          i++;
          }); 
   }
   });

我真的不知道问题出在哪里。我已经在堆栈溢出中阅读了一些线程并添加了.collapsible属性,但它不起作用......只有纯文本。

提前谢谢。最好的问候,约翰。

您是否尝试过在附加的每个元素的末尾添加.trigger('create')