我需要创建一个小的 jquery 插件，但是有一个很奇怪的问题

Question

点这里jsfiddle

$(function(){
    $.fn.my_alert = function(){
     var base = this;
       base.init = function() {
           base.on('click',function(e) {  base.onClick();   });
      }
       base.onClick = function(){
           alert(base.attr('data-id'));
       }
       base.init();
    }
});

$(document).ready(function(){
   $('.myalert').my_alert();
});

当我点击任何按钮时，它会提醒第一个按钮的 data-id 属性，

但我需要它来显示单击按钮的数据 ID 属性..

Answer 1

问题是在点击处理程序中使用 base，您应该在这里使用 this，因为 base 是插件附加到的所有匹配元素，而不是只是点击的元素。

您应该改为这样做，删除 base 变量，并返回 this.each(... 以使其可链接

$(function() {
    $.fn.my_alert = function() {
        return this.each(function() {
            $(this).on('click', function(e) {
                alert( $(this).data('id') );
            });
        });
    }
});