Kin*_*ien 12 javascript jquery knockout.js
获取无序列表的clicked元素索引的最佳方法是什么?
让我举个例子.说我有以下HTML代码:
<ul data-bind="foreach: listItems">
<li data-bind="click: $parent.itemClicked">
<p data-bind="text: title"></p>
</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
现在我有以下javascript代码来获取索引:
...
self.itemClicked = function(data, item) {
var index = $(item.target).index();
}
Run Code Online (Sandbox Code Playgroud)
...
但问题是,如果目标元素是<p>,例如,我得到不正确的结果.那么我应该如何获得被点击<li>元素的索引?淘汰赛是否有一些方法,或者我应该以某种方式使用jquery?
Jos*_*ant 23
我建议使用Knockout的$indexcontext属性.见下面的例子(JsFiddle):
HTML
<!DOCTYPE html>
<html>
<body>
<ul data-bind="foreach: listItems">
<li data-bind="click: $parent.itemClicked.bind($data, $index())">
<p data-bind="text: title"></p>
</li>
</ul>
</body>
</html>
?
Run Code Online (Sandbox Code Playgroud)
JavaScript的
var vmodel = {
listItems: ko.observableArray([
{title: "Able"},
{title: "Baker"},
{title: "Charlie"}]),
itemClicked: function(index) {
alert(index);
}
};
ko.applyBindings(vmodel);?
Run Code Online (Sandbox Code Playgroud)
Ole*_*hko 14
而不是弄乱你的绑定,在事件函数中获取索引更漂亮.你可以得到绑定上下文从event.target使用ko.contextFor(element)
self.click = function (data, event) {
var context = ko.contextFor(event.target);
console.log(context.$index());
};
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
10996 次 |
| 最近记录: |