Geek Answers Handbook

Variable scope: this.remove is not a function

this.remove () is not a function. Why?

var vehicle = function () {
    return {
        init: function () {
            jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) {
                e.preventDefault();
                this.remove();
            });
        },
        remove: function () {
            alert('test');
        }
    }
}();

jQuery().ready(vehicle.init);

Sorry for the confusion. I am trying to call my own delete function. This is just a vehicle management class on my page. This is the beginning, and it will have many more functions than just init / remove.

+5
source share
6 answers

Since you said you were trying to call your own function remove, here's how to do it:

var vehicle = (function () {
    return {
        init: function () {
            var that = this; // step one
            jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) {
                e.preventDefault();
                that.remove();
            });
        },
        remove: function () {
            alert('test');
        }
    }
}()); // step zero - wrap the immediate invocation in parens

jQuery(function () {
    vehicle.init(); // step two
);
0
source

thisis a DOM element. To use the jQuery method .remove(), you need to wrap it in a jQuery object.

$(this).remove();

EDIT: remove() vehicle, :

vehicle.remove();

, .ready(), :

jQuery(vehicle.init);

jQuery 1.4:

jQuery().ready() 1.4, . jQuery(document).ready() jQuery(function(){}).

+5

. , , "" .

, "init" , "this" , "". ? Javascript "this" , . , , .

:

jQuery(function() {
  vehicle.init();
});

"init" — ; Javascript "this" "".

edit oh wait , "init" , "click" jQuery , "this" . , " ", :

    init: function () {
        var originalThis = this;
        jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) {
            e.preventDefault();
            originalThis.remove();
        });
    },
+2

, - ?

var vehicle = new function () {

  var self = this;

  this.init = function () {
    jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) {
      e.preventDefault();
      self.remove();
    });
  };

  this.remove = function () {
    alert('test');
  };

};

... ? , ...

var vehicle = new function () {

  function remove () {
    alert('test');
  }

  this.init = function () {
    jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) {
      e.preventDefault();
      remove.call(this);
    });
  };

};
+2
var vehicle = function () {
    return {
        init: function () {
            var self = this;
            jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) {
                e.preventDefault();
                self.remove();
            });
        },
        remove: function () {
            alert('test');
        }
    }
}();

jQuery().ready(function() {
   vehicle.init();
});
0

"this" , . jQuery html, "this" .

To make sure that you are referencing the correct object, you need to create a link to the source object.

   var vehicle = function () {
       var that =  {
        init: function () {
            jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) {
                e.preventDefault();
                that.remove();
            });
        },
        remove: function () {
            alert('test');
        }
    }
    return that;
   }();

jQuery().ready(vehicle.init);
0
source

More articles:


All Articles