0

我有一个如下的列表视图：

               <ul data-inset="true" data-filter="true" data-bind="foreach: growers" data-role="listview" id="ulGrowerList">
          <li><a data-bind="click: $parent.setSelectedClassToGrowerList, attr: {id: growerId}"><span data-bind="text: growerName, attr: {id: growerId}, click: $parent.setSelectedClassToGrowerList" /></a></li>
      </ul>

我的 setSelectedClassToGrowerList 看起来像这样：

    self.setSelectedClassToGrowerList = function (item, event) {

    $(ulGrowerList).closest('ul').find('a').removeClass('highlight');
    $(ulGrowerList).closest('ul').find('.selected').remove();

    $(event.target).toggleClass("highlight");
    if ($(event.target).hasClass("highlight")) {
      $(event.target).append("<span class='selected'>Selected</span>");
      //console.log(event.target.id);
      replaceByValue('GrowerID', event.target.id);
      postjson();

      //update GrowerInfo 
      $.getJSON("Grower/GetGrower", function (allData) {
        self.GrowerName(allData.Name);
        self.GrowerCompany(allData.CompanyName);
        self.GrowerAddress(allData.Address);
        self.ShowGrowerCompany(allData.ShowCompany);
        self.GrowerID(allData.ID);
      });

    } else {
      $(event.target).find(".selected").remove();
    }

如您所见，我将 setSelectedClassToGrowerList 绑定到 和 标记，因为单击文本（跨度）没有采取所需的操作。现在，问题是，当我单击文本本身时，不显示“选定”文本。我正在寻找的功能与此类似：http: //jsfiddle.net/czqXm/1/除了能够选择多个已经在工作的项目。

我使用淘汰赛和 jquery mobile 的次数越多，我就越倾向于得出它们不是最佳组合的结论（叹气！）。

4

1 回答 1

2

好的。我认为这是一个重复处理程序问题。

发生的事情是，当您单击文本时，因为它在 SPAN 上有一个单独的单击处理程序，在单击处理程序内部，实际上正在注册两个单击事件……第一个使“已选择”出现，第二个使它再次消失。

我认为您可能可以简化对此的绑定

<li><a data-bind="click: $parent.setSelectedClassToGrowerList, 
                  attr: {id: growerId}, 
                  text: growerName"></a></li>

...但是看看这个小提琴

于 2012-09-28T13:29:10.717 回答