使用Handlebars.js helper用jQuery创建活动元素

Using Handlebars.js helpers to create active elements with jQuery?

本文关键字:jQuery 创建活动 元素 helper Handlebars js 使用      更新时间:2023-09-26

是否可以在Handlebars.js helper中使用jQuery创建元素并将事件处理程序附加到它们?我希望能够使用帮助器创建活动元素。

的例子:

Handlebars.registerHelper("button", function(title) {
    var button = $('<button>').text(title);
    button.click(function() {
        alert("Button " + title + " clicked.");
    });
    return $('<div>').append(button).html();
});

在把手模板中,我像这样实例化按钮:

{{{button "Click Me!"}}}

我明白这不能工作,因为jQuery的html()函数'删除'事件处理程序…但是简单地返回按钮显然也不起作用。Handlebars帮助程序应该能够返回DOM节点,但这是不可能的,对吧?我试图返回button.get(),但没有成功。

任何想法?

您可以在registerHelper之外创建一个称为onClick的函数。所以它的代码应该是这样的:

Handlebars.registerHelper("button", function (text) {
    var button = $('<button></button>').text(text).attr('onclick', 'button_clickEvent()');
    return $('<div></div>').append(button).html();
});
var button_clickEvent = function () {
    alert("Button " + $(this).text() + " clicked.");
};