1

我的页面上有以下元素，它从我的 javascript MVC 框架中获取动态添加的 ID：

<input data-bind="attr: { id: attributeName }" type="text" />

当元素在页面上动态呈现时，生成的 HTML 如下所示：

<input id="job_title" data-bind="attr: { id: attributeName }" type="text" />

但是，当我尝试单击输入框的功能时，它不起作用。（虽然相同的代码适用于预先存在的输入元素）。

$("#job_title").click(function() {
    alert('hi');
});

当输入元素通过动态“id”属性动态添加到页面时，上面的代码似乎不起作用。我在 knockout.js foreach 循环中将此元素添加到页面中，但我不知道这是否重要。有没有其他人遇到过这个？

这是真正的代码......我如何模拟 $("body").on() 方法来替换它：

 $("#job_title").typeahead({
    source: searchFunction,        
    onselect: function(obj) {            
    }
 });
4

3 回答 3

2

您可能想尝试：

$("body").on("click", "#job_title", function() { alert('hi'); });

这应该有效，click因为您正在动态添加元素。

于 2012-06-14T15:55:33.157 回答
1

我建议像这样编写一个自定义的淘汰赛活页夹

ko.bindingHandlers.typehead = {
    init: function(e){
        $(e).typeahead({
            source: searchFunction,        
            onselect: function(obj) {            
            }
         });
    }
};

然后像使用任何其他 Knockout 活页夹一样应用活页夹

<input id="job_title" data-bind="attr: { id: attributeName }, typehead:true" type="text" />
于 2012-06-14T17:03:34.133 回答
0

你为什么不只使用点击数据绑定？就像是：

<input data-bind="attr: { id: attributeName }, click: functionToCall" type="text" />

这将允许您从 DOM 操作中抽象出来，这是首先使用数据绑定的主要优点之一。您甚至可以让该功能来自您的视图模型上的一个属性，该属性可以动态地对上下文做出反应。

于 2012-06-14T16:31:33.157 回答