Question

我有一个JQM可折叠，可以在按钮点击时动态创建。我想动态创建嵌套的可折叠，我需要通过传递“this”作为控制对象来注册javascript，就像我们为正常的html控件做的那样。

for (var i = 0; i < arrList.length; i++) {
           var arr = arrList[i].split('#');
           var Programme = arr[0];
           var arr2 = arr[1].split('><');
           var revenue = arr2[0];
           var time = arr2[1];

      // Append a new collapsible and store it into a JQuery object                 
      $('#tdDynamic').append('<div id="collapsible_PG' + i + '" 
                                   data-role="collapsible" 
                                   data-collapsed="true" 
                                   data-theme="e" 
                                   data-content-theme="c"'
                                   + ' onclick="onexpand(this);"></div>');

       // Append the list header and store it into a JQuery object
       var collapsible = $('#collapsible_PG' + i);

      collapsible.append('<h3 id="h3Text_PG' + i + '">' 
                           + Programme + '&nbsp;&nbsp;&nbsp;' 
                           + time + '&nbsp;&nbsp;&nbsp;' 
                           + revenue + '</h3>');
//var h3Text = $('#h3Text' + i);
//collapsible.bind('expand', function () { onexpand('#h3Text' + i); });
                            collapsible.collapsible();
    }

这有可能像onclick="onexpand(this);"吗？

点击按钮，我尝试使用

collapsible.bind('expand', function () { onexpand(collapsible); });

但这只是给出了所有动态生成的可折叠点onclick的最后一个id。因此，即使我点击第一个可折叠，它也会显示最后一个被绑定的。我想绑定会被循环中添加的每个新的collpasible覆盖，这就是为什么我在寻找像onclick ='funcName（this）'这样的东西。我是JQM的新手，请指出我正确的方向。

我已提到各种SO问题，但找不到任何可以帮助我的事情。

I reffred to this jsfiddle example.

Answer 1

由于评论很有用，你可能已经找到了基于它的解决方案，我将其作为答案。

您可以将click事件处理程序附加到生成collapsible的块之外。这样，所有未来的项目都将自动涵盖：

即：

// Select all divs which id starts with...
$("div[id^='collapsible_PG']").on("click", function () {
    // $(this) here will refer to the exactly element clicked
    onexpand($(this));
});

$('#tdDynamic').append('<div id="collapsible_PG' + i + '" 
    data-role="collapsible" 
    data-collapsed="true" 
    data-theme="e" 
    data-content-theme="c"></div>');

将Javascript注册到动态嵌套可折叠

1 个答案: