为什么我的滚动eventListener没有触发?

时间:2015-06-03 21:07:03

标签: javascript angularjs javascript-events event-listener

我正致力于在Angular应用中构建无限滚动功能。一次建立一步,目前我在#tags-panel-list附加eventListener的部分,需要检查它的位置。

然而{I}使用console.log并未触发任何基本<section id="tags-col" class="tag-column column"> <ul id="tags-panel-list"> <li ng-repeat="tag in tags"> <div class="tag">{{tag.term}}</div> </li> </ul> </section>

Plnkr:http://plnkr.co/edit/7OnKAGvVNXWLwN5fZqJu?p=preview

tagsPanel.html 标记:

$timeout

tagsPanelDirective 控制器代码(使用var scrollingElement = function(event) { // I do not see these console logs in the chrome dev inspector console.log('scrolling...'); console.log(event); }; $timeout(function() { document.getElementById('tags-panel-list').addEventListener('scroll', scrollingElement); }, 250); ,因为Angular在首次加载时无法看到DOM元素):

from PyQt4 import QtCore, QtGui


try:
    _fromUtf8 = QtCore.QString.fromUtf8
except AttributeError:
    def _fromUtf8(s):
        return s

try:
    _encoding = QtGui.QApplication.UnicodeUTF8
    def _translate(context, text, disambig):
        return QtGui.QApplication.translate(context, text, disambig, _encoding)
except AttributeError:
    def _translate(context, text, disambig):
        return QtGui.QApplication.translate(context, text, disambig)

class Ui_TableForm(object):
    def setupUi(self, TableForm):
        TableForm.setObjectName(_fromUtf8("TableForm"))
        TableForm.resize(495, 506)
        TableForm.setLocale(QtCore.QLocale(QtCore.QLocale.Russian, QtCore.QLocale.RussianFederation))
        self.verticalLayout = QtGui.QVBoxLayout(TableForm)
        self.verticalLayout.setObjectName(_fromUtf8("verticalLayout"))
        self.table_widget = QtGui.QTableWidget(TableForm)
        self.table_widget.setRowCount(0)
        self.table_widget.setColumnCount(0)
        self.table_widget.setObjectName(_fromUtf8("table_widget"))
        self.verticalLayout.addWidget(self.table_widget)
        self.horizontalLayout = QtGui.QHBoxLayout()
        self.horizontalLayout.setObjectName(_fromUtf8("horizontalLayout"))
        self.start_edit_button = QtGui.QPushButton(TableForm)
        self.start_edit_button.setObjectName(_fromUtf8("start_edit_button"))
        self.horizontalLayout.addWidget(self.start_edit_button)
        self.save_edits_buttonBox = QtGui.QDialogButtonBox(TableForm)
        self.save_edits_buttonBox.setEnabled(False)
        self.save_edits_buttonBox.setStandardButtons(QtGui.QDialogButtonBox.Cancel|QtGui.QDialogButtonBox.Save)
        self.save_edits_buttonBox.setObjectName(_fromUtf8("save_edits_buttonBox"))
        self.horizontalLayout.addWidget(self.save_edits_buttonBox)
        self.verticalLayout.addLayout(self.horizontalLayout)

        self.retranslateUi(TableForm)
        QtCore.QMetaObject.connectSlotsByName(TableForm)

    def retranslateUi(self, TableForm):
        TableForm.setWindowTitle(_translate("TableForm", "Таблица", None))
        self.start_edit_button.setText(_translate("TableForm", "Редактировать", None))




class TableForm(QtGui.QDialog, Ui_TableForm):


  def __init__(self):
    super(TableForm, self).__init__()
    self.ui = Ui_TableForm()
    self.ui.setupUi(self)
    data = [['name1', 'name2'], {'name1':[1], 'name2':[2]}, 2]
    col_names = data[0]
    col_data = data[1]
    rows = data[2] + 1
    cols = len(col_names)
    self.ui.table_widget.setRowCount(rows)
    self.ui.table_widget.setColumnCount(cols)
    self.ui.table_widget.setHorizontalHeaderLabels(col_names)
    n = 0
    for key in col_names:
      m = 0
      for item in col_data[key]:
        newitem = QtGui.QTableWidgetItem(item)
        self.ui.table_widget.setItem(m, n, newitem)
        m += 1
      n += 1


if __name__ == "__main__":
    import sys
    app = QtGui.QApplication(sys.argv)
    dialog = QtGui.QDialog()
    u = TableForm()
    u.setupUi(dialog)
    dialog.show()
    sys.exit(app.exec_())

3 个答案:

答案 0 :(得分:4)

实际上ID为tags-col的元素正在滚动:

$timeout(function() {
  document.getElementById('tags-col').addEventListener('scroll', scrollingElement);
}, 250);

Plunker

答案 1 :(得分:3)

您还可以在现代浏览器上收听“滚轮”。无论元素如何,这都会拾取滚动。

document.addEventListener("wheel", function(event) {
    console.log(event);
});

答案 2 :(得分:0)

// only this work
document.addEventListener('scroll', function(e) {
  console.log(123);
  console.log($(window).scrollTop());
})