未定义Jquery myfunction。

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);

我希望使用MonPlugin作为函数，它包含在不同事件上，但是控制台返回未定义的ReferenceError: MonPlugin。

Answer 1

​

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>

​

Answer 2

打电话

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

而不是

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

Answer 3

使用这种方式创建函数：

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

或

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