Javascript 从插件创建的按钮调用jquery函数

我有一个非常简单的jquery插件，它创建一个按钮并将其附加到元素：

(function($) {
  $.fn.somePlugin = function(element, options) {

    var button = '<button>Hello World</button>';
    $(element).append(button);

    var sayHello = function(){
      alert('Hello World');
    }

  };
})(jQuery);

（函数（$）{
$.fn.somePlugin=函数（元素、选项）{
var按钮='Hello World'；
$（元素）.append（按钮）；
var sayHello=函数（）{
警报（“你好世界”）；
}
};
})（jQuery）；

---

我的问题是，单击按钮时如何调用sayHello函数？蒂亚

您可以使用

$（'Hello World'）

将HTML代码转换为jQuery对象，然后您可以像对任何其他jQuery对象一样攻击

单击事件：

(function($) {
  $.fn.somePlugin = function(element, options) {

    var button = '<button>Hello World</button>';

    var sayHello = function(){
      alert('Hello World');
    }
    var $button = $(button).click(sayHello);
    $(element).append($button);

  };
})(jQuery);

（函数（$）{
$.fn.somePlugin=函数（元素、选项）{
var按钮='Hello World'；
var sayHello=函数（）{
警报（“你好世界”）；
}
var$按钮=$（按钮）。单击（sayHello）；
$（元素）。追加（$按钮）；
};
})（jQuery）；
创建一个jQuery对象，将click事件与该对象绑定，然后将其附加到容器元素

（函数（$）{
$.fn.somePlugin=函数（元素、选项）{
var sayHello=函数（）{
警报（“你好世界”）；
}
var按钮=$（'Hello World'）；
按钮。在（'click'，sayHello）上；
按钮。附加到（元素）；
};
})（jQuery）；
插件代码：

(function ($) {

    $.fn.somePlugin = function (el, options) {

        var $el = $(this);

        $el.append("<button>Hello World</button>");

        $el.on("click", "button", function(){
          alert("Hello World");
        });
    };

})(jQuery);

试验

<div id="target"></div>

$("#target").somePlugin();