0

jQueryでDurandal(requireJS+knockoutJS)を使っています

jquery 1.10.2 + knockoutjs 2.3.0 + requirejs

単純なコードでも機能しません

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

フェードアウト(); フェードイン（）が機能していません

しかし、各機能は正常に機能しています

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

推測はありますか？ありがとう

4

2 に答える 2

0

JQuery イベント ハンドラーが接続された後に DOM がロードされている場合、まったく接続されません (たとえば、イベント ハンドラーを追加した後に 'table1' テーブルが追加された場合、それは AJAX などを介してロードされるため)。代わりに、何らかのイベント委任を行う必要があります。これを行う最も簡単な方法は、イベントを存在するもの (ドキュメントは明らかなドキュメント) にアタッチし、イベント ハンドラーをフィルター処理することです。例えば

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

そうすれば、ドキュメントが実際にイベントを処理するため、イベント ハンドラーが起動された時点でそのフィルターが評価されるため、「table1」が後で追加されても問題ありません。

于 2015-08-06T12:03:21.187 に答える
0

問題は、テーブル自体をスクロールしようとしている可能性があります。divをスクロールするとうまくいきます。スクロールバーを動かそうとするとアラートが表示されます。

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());
.scrolly {
  overflow-y: scroll;
  max-height: 300px;
  width: 300px;
}
.bigblock {
  height: 800px;
  width: 300px;
  background-color: #cfc;
}
<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>

于 2015-08-06T20:05:44.333 に答える