Js:Calling a function on click

Question

I use Maplace.js, A Google Maps Javascript plugin for jQuery. In a plugin has a function that will display the marker on the map.

//triggers to show a location in map
    Maplace.prototype.ViewOnMap = function (index) {
        //view all
        if (index === this.view_all_key) {
            this.o.beforeViewAll();
            this.current_index = index;
            if (this.o.locations.length > 0 && this.o.generate_controls && this.current_control && this.current_control.activateCurrent) {
                this.current_control.activateCurrent.apply(this, [index]);
            }
            this.oMap.fitBounds(this.oBounds);
            this.CloseInfoWindow();
            this.o.afterViewAll();

        //specific location
        } else {
            index = parseInt(index, 10);
            if (typeof (index - 0) === 'number' && index > 0 && index <= this.ln) {
                try {
                    google.maps.event.trigger(this.markers[index - 1], 'click');
                } catch (err) {
                    this.debug('ViewOnMap::trigger', err.stack);
                }
            }
        }
        return this;
    };

I try to call this method but to no avail:

<a href="javascript:Maplace.prototype.ViewOnMap(2)">Link</a>

how can I call from a link with key?

Answer 1

Since ViewOnMap is defined on Maplace prototype, it means that this is an instance method. So you should call it on Maplace instance object. Something like this:

var maplace = new Maplace({ ... });
maplace.Load();

and later:

<a href="javascript:maplace.ViewOnMap(2)">Link</a>

Answer 2

You can do it like this:

<a class="openmap" href="#">Link</a>

and the js:

$('.openmap').on('click', function(e){
e.prevetDefault();
Maplace.prototype.ViewOnMap = function (index) {
        //view all
        if (index === this.view_all_key) {
            this.o.beforeViewAll();
            this.current_index = index;
            if (this.o.locations.length > 0 && this.o.generate_controls && this.current_control && this.current_control.activateCurrent) {
                this.current_control.activateCurrent.apply(this, [index]);
            }
            this.oMap.fitBounds(this.oBounds);
            this.CloseInfoWindow();
            this.o.afterViewAll();

        //specific location
        } else {
            index = parseInt(index, 10);
            if (typeof (index - 0) === 'number' && index > 0 && index <= this.ln) {
                try {
                    google.maps.event.trigger(this.markers[index - 1], 'click');
                } catch (err) {
                    this.debug('ViewOnMap::trigger', err.stack);
                }
            }
        }
        return this;
    };
});

Answer 3

I decided this question in this way:

<a onclick="javascript:maplace.ViewOnMap()" href="#gmap">Link</a>

Tried many things, and everything was easy. No need to change anything, or append to the code. Thank you all.