Javascript 对象文本中的事件处理程序未触发

我正在创建一个Wordpress插件，我已经创建了一个对象文本，我想在其中封装我的所有逻辑，但我似乎无法启动事件处理程序

我正在使用jQuery1.7.1

首先，我有通过php创建的数据行：

<div class="table-wrapper">

    <?php 
        global $wpdb;

        $students = $wpdb->get_results("SELECT studentID, lname, fname, email FROM student");    

  foreach($students as $student) : ?>
    <div class="row" id="<?php echo $student->studentID; ?>" >
        <div class="last_name">
            <h4><?php echo __($student->lname); ?></h4>
        </div>
        <div class="first_name">
            <h4><?php echo __($student->fname); ?></h4>
        </div>
        <div class="phone">
            <h4><?php echo __($student->phone); ?></h4>
        </div>
        <div class="email">
            <h4><?php echo __($student->email); ?></h4>
        </div>
    </div><!-- /row -->
    <?php endforeach; ?>
    <div id="new">
        <button id="new_student"><?php echo __('Add New Student'); ?></button>
    </div>
</div><!-- /table-wrapper -->

我尝试了一些小的变化，例如将“.row”传递给studentSelection变量，并尝试在bindEvents方法中将事件处理程序直接绑定到该变量：

bindEvents: function(){
    console.log('in bind');  // this fires upon instantiation
    this.config.studentSelection.on('click', this.config.fetchStudentDetails);
    console.log('after');  // this does NOT fire
  },

Student.init({
  studentID: jQuery('.row').attr('id'),
  studentSelection: jQuery('.row')
});

但是，当我编写如下代码时，我能够触发click事件：

jQuery('.row').click, function(){
     console.log('in click event');
});

var Student = function (config) {

    config = config || {};

    var that = this, // In case you need to use the original `this`
        isDisplayed = false;

    var init = function () {
        console.log('in init');
        bindEvents();
    };

    var bindEvents = function () {
        console.log('in bind');
        config.studentSelection.on('click', '.row', fetchStudentDetails);
        console.log('after');
    };

    var fetchStudentDetails = function () {
        // var self = Student; <-- Use `that`
        alert('in event');
    };

    return {
        init: init,
        bindEvents: bindEvents,
        fetchStudentDetails: fetchStudentDetails
    }

};

// Create a new student
var student = new Student({ ... });
student.init();

---

我不明白发生了什么，所以如果有人能解释一下或者给我指出正确的方向，我会非常感激。

你的

这个
上下文都是错误的
this.config.studentSelection
是
未定义的
以及
this.config.fetchStudentDetails
。
this
指的是
bindEvents
而不是
init
。我建议您在这里使用不同的模式。大概是这样的：

jQuery('.row').click, function(){
     console.log('in click event');
});

var Student = function (config) {

    config = config || {};

    var that = this, // In case you need to use the original `this`
        isDisplayed = false;

    var init = function () {
        console.log('in init');
        bindEvents();
    };

    var bindEvents = function () {
        console.log('in bind');
        config.studentSelection.on('click', '.row', fetchStudentDetails);
        console.log('after');
    };

    var fetchStudentDetails = function () {
        // var self = Student; <-- Use `that`
        alert('in event');
    };

    return {
        init: init,
        bindEvents: bindEvents,
        fetchStudentDetails: fetchStudentDetails
    }

};

// Create a new student
var student = new Student({ ... });
student.init();

var Student=函数（配置）{
config=config |{}；
var that=this，//如果您需要使用原始的`this`
isDisplayed=false；
var init=函数（）{
log（'in init'）；
bindEvents（）；
};
var bindEvents=函数（）{
log（'in bind'）；
config.studentSelection.on（'click'，'.row'，fetchStudentDetails）；
console.log（'after'）；
};
var fetchStudentDetails=函数（）{
//var self=Student；不应该
this.config.fetchStudentDetails
是
this.fetchStudentDetails
？谢谢你这么快回答Paolo。那实际上也不管用，我也试着用Student.fetchStudentDetails来调用它，但没有用。谢谢你的回答。我希望我能说我理解每一个问题但是，由于我仍在尝试将注意力集中在对象文字符号和此模式上，我还没有看到两者之间的优点/区别。我也尝试了您的代码，但仍然不起作用，我从未看到
console.log（'after'））bindEvents fire中的
语句，这让我相信，
config.studentSelection.on（'click'，'.row'，fetchStudentDetails）
语句中的代码似乎到此为止。