淘汰赛渲染的链接，点击处理问题

讲起与代码：淘汰赛渲染的链接，点击处理问题

<div class="alert alert-info" role="alert" title="Shows player rankings">     
      <ul class="nav nav-pills" data-bind="foreach: userRanks"> 
       <!-- ko if: ($index() === 0) --> 
       <li> 
        <a href="#" class="btn btn-default" title="Refresh ranks"><i class="glyphicon glyphicon-refresh"></i></a> 
       </li> 
       <!-- /ko --> 
       <li> 
        <a href="#" data-bind="attr: { title: $data.rank}"> 
         <!-- ko text: $data.username --><!-- /ko --> 
         <span class="badge" data-bind="text: $data.score"></span> 
        </a> 
       </li> 
       <!-- ko if: ($index() === ($parent.userRanks().length - 1)) --> 
       <li class="pull-right">       
        <a href="javascript:void(0)" id="btnPush" class="btn btn-default" data-url="@Url.Action("PushPlayerinfo", "Home")">Update score</a> 
       </li> 
       <li class="pull-right" data-bind="attr: {title: $parent.currentUserName}"> 
        <a href="#">You <span class="badge" data-bind="text: $parent.currentUsertotalScore"></span>/<span data-bind="text: $parent.currentUserRank"></span></a> 
       </li> 
       <!-- /ko --> 
      </ul> 
</div>

我已经注册了click处理程序链接 'btnPush' 为：

$("#btnPush").on('click', function() { 
//My code 
});

只需用基因敲除的foreach控制，虚拟元素和上下文，不知道我失踪，但点击永远不会注册为此链接。内嵌HTML onClick()工作虽然：

<a href="javascript:void(0)" onclick="pushData(this);" id="btnPush" class="btn btn-default" title="Click to persist current score" data-url="@Url.Action("PushPlayerinfo", "Home")">Update score</a>

此外，如果同一链路是UL-容器的外面（外的foreach约束力的），它工作正常。有人可以建议我吗？

来源

2014-10-28 Bishnu Rawal

因为您的元素是动态生成的，所以您应该使用委托事件，并在jquery doc中详细记录。 – 2014-10-28 20:20:10

如果你无论如何都在使用knockout，为什么不用它来处理点击事件呢？ – nemesv 2014-10-28 20:32:57

@nemesv好评。我甚至会说它可能是一个答案，如果不是针对OP，那么对于那些以搜索查询结束这个问题的人。当使用KO时，['click' binding]（http://knockoutjs.com/documentation/click-binding.html）完全是为了这个任务。 – Jeroen 2014-10-28 20:38:03

你应该用敲除来处理点击事件。使用jQuery来处理DOM时是一个糟糕的做法，当你使用knockout时，如果你使用ko点击绑定，它也会很容易。

检查文档：http://knockoutjs.com/documentation/click-binding.html

*如果你需要运行一个劫的foreach内的方法，而这种方法属于VM记得使用$父母或$根密钥。

<ul data-bind="foreach: items"> 
    <li>       
    <a data-bind="click: $parent.yourMethod()>link</a> 
    </li> 
</ul>

来源

2014-10-30 21:18:59 ianaya89

谢谢ianaya89，我已经做到了。 – 2014-10-31 12:57:03

淘汰赛渲染的链接，点击处理问题

回答

相关问题