1

我使用 jQuery 和 Web 服务创建了一个树结构。我通过动态 html 创建树的子节点，动态 html 在需要时动态创建。这棵树对我来说很好。

现在我的第二个任务是在其中添加一个自定义滚动条（类似于 facebook/gmail 所拥有的）。我为此使用了 JQuery Tiny Scrollbar 插件，它在第一步运行良好，但无法应对动态添加的 html。

我的树如下所示：

- Asia
   India
   China
+ Europe
+ South America

上面的 Html 如下所示：

<ul>
   <li><span>-</span><span>Asia</span></li>
   <li><span></span><span>India</span></li>
   <li><span></span><span>China</span></li>
   <li><span>+</span><span>Europe</span></li>
   <li><span>+</span><span>South America</span></li>
</ul>

当用户单击“+”图标时，会即时创建欧洲和南美洲国家的 Html

现在这个动态创建的 HTML 出现了问题，因为这个小滚动条插件无法处理这个动态 HTML。它只是忽略了这个 HTML。请提出任何建议来纠正这个问题。

谢谢，拉维古普塔

4

2 回答 2

1

我认为您所要做的就是在加载内容后调用滚动条插件的更新功能：

//some operation that changes the viewport content...

oScrollbar5.tinyscrollbar_update();

该示例来自插件的主页：http: //baijs.nl/tinyscrollbar/

在动态内容更改后，您将调用此（或类似）代码。

于 2012-08-21T20:35:29.617 回答
0

由于元素一开始并不存在，因此无法通过传统的 document.ready 绑定对其进行绑定。您要做的是使用 .on() 方法 ( http://api.jquery.com/on/ ) 绑定到容器并指定一个元素来执行附加的函数。例如：

$('ul').on('click', 'li', function(e){
  $(this).doStuffWithChildLIElement();
});

这样，在 DOM 就绪后创建的任何新的 LI 元素仍将绑定到您创建的点击处理函数。

于 2012-08-21T20:33:55.257 回答