Jquery引用此

Question

鉴于对象：

// A data set
$.DataArea = function () {

    // Default options
    $.extend(this, {
        class: 'DataSet',
        data: new Array(),
        container: null
    });

    // Add a bar to this object
    this.addBar = function(startDate, endDate, label) {    
        var insertPos = this.data.length;
        this.data[insertPos] = new $.DataBar();
        this.data[insertPos].startDate = startDate;
        this.data[insertPos].endDate = endDate;
        this.data[insertPos].label = label;

        this.container.children('.jobArea').append('<div class="bar-wrapper"><div class="bar">' + label + '</div></div>');   



    }

    // Bind the bar to a div
    this.bind = function(docID) {
        this.container = $('#' + docID);   
        this.container.append('<div class="jobArea"></div>')     
    };

    this.init = function() {

        this.container.children('.jobArea .bar, .jobArea .marker').each(function(i) {
            $(i).bind("selectstart", _preventDefault);
        });

    };

};

我觉得行$(this).bind("selectstart", _preventDefault);不起作用，因为$(this)与对象的this发生冲突？

如何以非冲突的方式正确引用each循环中的所选元素？ （如果那是问题）

修改

正在使用的DataArea：

var MyData = new $.DataArea();
MyData.bind("container");
MyData.addBar("", "", "Bar 1");
MyData.addBar("", "", "Bar 2");
MyData.init();

Answer 1

返回使用this代替i，并使用find()^[docs]方法代替children()^[docs]方法。

this.init = function() {

      //------------v
    this.container.find('.jobArea .bar, .jobArea .marker').each(function(i) {
        $(this).bind("selectstart", _preventDefault);
    });

};

这是必要的，因为.bar而.marker不是container的直接后代。

Answer 2

传递给.each()回调的第二个变量是实际元素。您应该可以像这样重写它：

this.container.children('.jobArea .bar, .jobArea .marker').each(function(i,e) {
    $(e).bind("selectstart", _preventDefault);
});

修改
我认为值得一提的是所有浏览器都不支持selectstart事件，这可能是问题所在。