Question

来自this link我学会了如何获得淘汰赛中点击元素的索引。但是我希望用它来获取数据和事件。

对于数据，我做了类似这样的事情，这很有效：

var vmodel = {
    listItems: ko.observableArray([
        {title: "Able"},
        {title: "Baker"},
        {title: "Charlie"}]),
    itemClicked: function(data,index) {
        alert(data);
        alert(index);
    }
};
ko.applyBindings(vmodel);

<ul data-bind="foreach: listItems">
    <li data-bind="click: $parent.itemClicked.bind($data, $data, $index())">
         <p data-bind="text: title"></p>
    </li>
</ul>

但我不知道如何访问活动。

由于

Answer 1

使用委托处理程序可能会更好： https://github.com/rniemeyer/knockout-delegatedEvents/

通过这种方式，您可以将一个事件处理程序附加到根节点，并且传递给viewmodel函数的参数是您需要的数据（第一个参数是对象，第二个是事件）。加上＆＃的范围39;这＆＃39;将是正确的。

我几乎只使用事件委托，因为一切都按照我的预期工作。

Answer 2

我同意Magrangs的观点，即在这种情况下事件授权会更优越，但是如果你打算使用这种模式，你可以这样做：

<ul data-bind="foreach: listItems">
  <li data-bind="click: $parent.itemClicked.bind($data, $index())">
         <a data-bind="text: title"></a>
  </li>
</ul>

var vmodel = {

    listItems: ko.observableArray([
        {title: "Able"},
        {title: "Baker"},
        {title: "Charlie"}]),

    itemClicked: function(index) {
        console.log(event);
        console.log(this);
        console.log(index);       
    }

};

ko.applyBindings(vmodel);

根据你想要实现的目标（触发另一个动作），也许对observable的订阅会像这样有用：

myViewModel.personName.subscribe(function(newValue) {
  alert("The person's new name is " + newValue);
});

出于可访问性原因，我还会在P标签上使用锚标签。

祝你好运！

Answer 3

在函数中再接收一个参数，它将包含事件详细信息的jsfiddle： - https://jsfiddle.net/31unkhxm/8/

  itemClicked: function(data,data,index,event) {
        console.log("d is"+event.currentTarget);
    }

来自KO文档

http://knockoutjs.com/documentation/click-binding.html

在某些情况下，您可能需要访问DOM事件对象与您的点击事件相关联。淘汰赛将通过该活动函数的第二个参数

在您的方案中，您将绑定数据，数据，索引，因此最后一个参数将是事件

Answer 4

我已经看到这个问题已被回复，但我想分享一种可以帮助某人的不同方法：不是将$ index作为参数传递给click函数，而是可以执行与函数本身不同的操作：

你可以使用：

var context = ko.contextFor(event.target);

通过这种方式，您可以访问完整的上下文。现在访问$ index很简单：

var index = context.$index();

所以完整回复是：

this.onClick = function (data, event) {
        var context = ko.contextFor(event.target);
        var index = context.$index();

    }

获取已淘汰的

4 个答案: