Question

我使用durandal（requireJS + knockoutJS）和jQuery

jquery 1.10.2 + knockoutjs 2.3.0 + requirejs

即使是简单的代码也无效

 $('#table1').scroll(function(){
      alert('');
 });

甚至fadeOut（）; fadeIn（）无效

但每个功能正常运作

$('.items').each(function(){ 
     $(this).css("display","none"); 
});

任何猜测？感谢

Answer 1

如果在连接JQuery事件处理程序之后加载了DOM，它根本就不会连接（例如，如果在添加了＆＃39; table1＆＃39;表之后）该事件处理程序，因为它是通过AJAX或类似方式加载的）。相反，您需要进行某种事件委派。最简单的方法是将事件附加到将存在的事物（文档是显而易见的），并过滤事件处理程序。 e.g。

$(document).on('scroll','#table1', function(e) {...});

这样，因为文档实际上处理了事件，所以＆＃39; table1＆＃39;稍后添加，因为在触发事件处理程序时评估该过滤器。

Answer 2

问题可能在于您尝试滚动表格本身。滚动div对我有用。当您尝试移动滚动条时，您会收到提醒。

＆＃13;

ko.bindingHandlers.scrollBinder = {
  init: function(element) {
    $(element).scroll(function() {
      alert("Scroll!");
    });
  }
};

var model = function() {
  var self = {};
  self.visibleStatus = ko.observable(true);

  return self;
};

ko.applyBindings(new model());

＆＃13;

.scrolly {
  overflow-y: scroll;
  max-height: 300px;
  width: 300px;
}
.bigblock {
  height: 800px;
  width: 300px;
  background-color: #cfc;
}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/2.3.0/knockout-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<div class="scrolly" data-bind="scrollBinder:true">
  <table>
    <tbody>
      <td class="bigblock"></td>
    </tbody>
  </table>
</div>

＆＃13;

.scroll（）jquery在knockout自定义绑定处理程序中不起作用？

2 个答案: