为什么$（this）.data（'id'）在对话框中使用时无效？

Question

我最初使用此功能在单击delete-item按钮时删除项目：

$( document ).on( "click", ".delete-item", function() {

                    console.log("Removing "+$(this).data('id'));
                    var id=$(this).data('id');
                    var parent=$(this).parent().parent().parent();      
                    parent.remove();
                    $(".subitem-row"+id).remove();
                    applyCartChanges();

});

工作正常。但是当我尝试在删除之前先进行对话（使用OnsenUI和PhoneGap）进行确认时，就像这样：

$( document ).on( "click", ".delete-item", function() {

        ons.notification.confirm({
          message: getTrans('Remove from cart?','remove_from_cart') ,     
          title: dialog_title_default ,
          buttonLabels: [ getTrans('Yes','yes') ,  getTrans('No','no') ],
          animation: 'default', // or 'none'
          primaryButtonIndex: 1,
          cancelable: true,
          callback: function(index) {

               if (index==0){                         

                    console.log("Removing "+$(this).data('id'));
                    var id=$(this).data('id');
                    var parent=$(this).parent().parent().parent();      
                    parent.remove();
                    $(".subitem-row"+id).remove();
                    applyCartChanges();

               }
          }
        });

});

然后它突然不起作用了:(在控制台中，undefined显示$(this).data('id')。有什么想法？

Answer 1

这是因为对this的引用不是作为对话框中的单击元素获得的。所以，将代码重写为

$( document ).on( "click", ".delete-item", function() {
        var _this = this;
        ons.notification.confirm({
          message: getTrans('Remove from cart?','remove_from_cart') ,     
          title: dialog_title_default ,
          buttonLabels: [ getTrans('Yes','yes') ,  getTrans('No','no') ],
          animation: 'default', // or 'none'
          primaryButtonIndex: 1,
          cancelable: true,
          callback: function(index) {

               if (index==0){                         

                    console.log("Removing "+$(_this).data('id'));
                    var id=$(_this).data('id');
                    var parent=$(_this).parent().parent().parent();      
                    parent.remove();
                    $(".subitem-row"+id).remove();
                    applyCartChanges();

               }
          }
        });

});

请注意，我已在新变量this中引用了_this，因此可以在对话框中访问它。