jQuery tmpl插件 - 动态内容的模板结果的问题(错误?) [英] jQuery tmpl plugin - problems with template results from dynamic content (bug?)

查看:922
本文介绍了jQuery tmpl插件 - 动态内容的模板结果的问题(错误?)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用jQuery范本( http://api.jquery.com/jquery.tmpl/ )在基于远程内容的页面上呈现列表,这一切都运行良好,但是当我应用一个类到内容,并有类的动态模板内容的点击事件不尊重行动,



我稍微编辑了tmpl插件附带的基本演示,添加了一个静态列表作为概念证明: http://jsfiddle.net/3eVrR/2/



点击静态栏链接会生成一个警报,如我所料。单击任何按钮(卡通或戏剧)以生成列表,然后单击它们超链接(它具有与硬编码链接相同的类)不会触发警报。



任何人都能看到问题是什么?



感谢

.click()处理程序仅适用于在处理程序初始化时可以选择的元素。在这种情况下, .live()(或 .delegate())处理程序将是一个更好的方法: / p>

  //此处理程序将应用于任何.getPage元素,即使在此处理程序声明之后创建
//已执行。
$('。getPage')。live('click',function(){
alert('getPage'');
}


I've use jQuery templates (http://api.jquery.com/jquery.tmpl/) to render lists on pages based on remote content, this is all working well, however when I apply a class to the content and have a click event for the class dynamic template content doesn't respect the action where as hard coded content works fine.

I've slightly edited the basic demo which ships with the tmpl plugin to add a static list as a proof of concept: http://jsfiddle.net/3eVrR/2/

Clicking the static 'bar' link generates an alert as I'd expect. Clicking any of the buttons (Cartoons or Drama) to generate a list then clicking they hyperlink (it has the same class as the hard coded link) does not fire the alert.

Can anyone see what the problem is? Firebug does not show any errors, on inspection the classes for both the static and dynamic content is the same.

Thanks

解决方案

As aleksv pointed out, traditional .click() handlers only apply to elements which can be selected when the handler is initialized. In this case, a .live() (or .delegate()) handler would be a better approach:

// This handler will apply to any .getPage element, even if it is created
//  after this handler declaration has been executed.
$('.getPage').live('click', function(){
    alert('clicked element with getPage class');
});

这篇关于jQuery tmpl插件 - 动态内容的模板结果的问题(错误?)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆