Jquery myfunction is not defined

Question

var widescreen = {
  "flex": "0 100%",
  "width": "100%",
  "-webkit-flex": "0 100%",
  "-moz-flex": "0 100%",
  "-ms-flex": "0 100%",  
};

jQuery.fn.MonPlugin=function() {
jQuery(".size-60").css(widescreen)
};

jQuery(".titre1").bind("click",MonPlugin);

I would like to use MonPlugin as function that I include on different events but console return Uncaught ReferenceError: MonPlugin is not defined.

Nigrimmist · Accepted Answer · 2016-01-08 18:03:32Z

3

Call

jQuery(".titre1").bind("click",$.fn.MonPlugin);

instead of

jQuery(".titre1").bind("click",MonPlugin);

answered Jan 8, 2016 at 18:03

Nigrimmist

12.8k4 gold badges61 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Norlihazmey Ghazali · Accepted Answer · 2016-01-08 18:02:32Z

1

Create function using this way instead :

var MonPlugin = function() {
  jQuery(".size-60").css( widescreen )
};

or

function MonPlugin() {
  jQuery(".size-60").css( widescreen )
}

answered Jan 8, 2016 at 18:02

Norlihazmey Ghazali

9,0701 gold badge25 silver badges42 bronze badges

Comments

synthet1c · Accepted Answer · 2016-01-08 18:16:15Z

var widescreen = {
  "flex": "0 100%",
  "width": "100%",
  "-webkit-flex": "0 100%",
  "-moz-flex": "0 100%",
  "-ms-flex": "0 100%",
};

// a plugin declared like this is added to jQueryies prototype allowing
// you to add the method to the chain of functions. but you would need to modify
// your code just a tad.

jQuery.fn.MonPlugin = function() {
  // plugins have the collection of the selected elements so loop through them all
  this.each(function(){
    // create a new jQuery object with the current element and bind your function
    jQuery(this).on('click', MonPluginCallBack );
};

// to call your plugin you would use
jQuery('.titre1').MonPlugin();


// it seems that you just want a callback function so you should use

function MonPluginCallBack( event ){
  jQuery(".size-60").css(widescreen);
}

// here you are passing the function by reference
jQuery(".titre1").bind("click", MonPluginCallBack );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Thanks, if i want to reset the css (normal value is 60%), which method you recommend ? Thanks
if you have access to the css file, I would do all the css there and simply toggle the class with javascript to trigger the different states. if you don't have access to the css you should save a variable in the parent state

DinoMyte · Accepted Answer · 2016-01-08 18:10:14Z

0

custom jquery function or jquery function extenders can only be used with a jquery object. So in order to invoke a custom function, you need to attach it to an element.

$.fn.MonPlugin = function() 
{
    alert();
}

$(".titre1").bind("click",function()
{
  $(this).MonPlugin();
})

Example : http://jsfiddle.net/DinoMyte/bvtngh57/149/

answered Jan 8, 2016 at 18:10

DinoMyte

8,8781 gold badge21 silver badges27 bronze badges

Collectives™ on Stack Overflow

Jquery myfunction is not defined

4 Answers 4

Comments

Comments

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

2 Comments

Comments

Related