Javascript 带有弹出窗口的Jquery单击事件

Javascript 带有弹出窗口的Jquery单击事件,javascript,jquery,Javascript,Jquery,我有以下代码,它不能正常工作,基本上我愿意在我的点击事件中添加确认删除弹出窗口,但当我点击删除行,然后点击apppear弹出窗口,我卡住了,无法理解发生了什么,这是我的代码 $.fn.matrix.deleteCategory = function ( jqObj ) { jqObj.find("#award").on('click', ".categoryminus", function () { var CategoryClass = $(this).clo

我有以下代码,它不能正常工作,基本上我愿意在我的点击事件中添加确认删除弹出窗口,但当我点击删除行,然后点击apppear弹出窗口,我卡住了,无法理解发生了什么,这是我的代码

$.fn.matrix.deleteCategory = function ( jqObj ) {

     jqObj.find("#award").on('click', ".categoryminus", function () {



        var CategoryClass = $(this).closest('tr').attr('class'); // table row Class 
         //split all class of current table row
        var CategoryArray = CategoryClass.split(' ');
         //delete all rows having class like C-1-o-1
        var categoryClassLike        = '[class^=' + CategoryArray[0] + '-o-]';

         //for rTenderDocument,check delete c-2,c-3 and appear popup
         if ( formType == 'rTenderDocument') {

            if ( CategoryArray[0] == 'C-2' ){

                $('#priceConfirm').bPopup();

                $('.priceConfirm').click(function(){

                    if($(this).attr('id') == 'priceDeleteNo'){
                        $('#priceConfirm').bPopup().close(); 
                        return false;

                     } else {
                        $('#priceConfirm').bPopup().close();
                        return true;

                     }
                }); 
            } else if ( CategoryArray[0] == 'C-3' ){

                $('#fixedAnnualConfirm').bPopup();

                $('.fixedAnnualConfirm').click(function(){

                    if($(this).attr('id') == 'fixedAnnualDeleteNo'){
                        $('#fixedAnnualConfirm').bPopup().close(); 
                        return false;

                     } else {
                        $('#fixedAnnualConfirm').bPopup().close();
                        return true;

                     }
                }); 
            }

         }  

         //remove all child of sub category
         $( categoryClassLike ).each(function(){

             var obj              = $(this);

             var subCategoryClass = obj.closest('tr').attr('class'); // table row Class 
             //split all class of current table row
             var subCategoryArray = subCategoryClass.split(' ');
             //delete all rows having class like C-1-o-3-So-1
             var classLike        = '[class^=' + subCategoryArray[0] + '-So-]';

            //remove all child of sub category
             $( classLike ).each(function(){
                 $(this).remove();
             });

             //remove sub category
              obj.remove();
         });

          //after removing child then delete their parent
          $(this).closest('tr').remove();

     });

     return jqObj;
   };

我不确定你的代码是做什么的,但我会给你另一个 根据表格和弹出确认来做您想做的事情的方法

看看这把小提琴:

我已经创建了一个包含del按钮的行的基本表:

<table>
    <tr><td>ID</td><td>NAME</td><td>ACTION</td></tr>
    <tr>
        <td><div>1</div></td>
        <td><div>Booba</div></td>
        <td><div><button class='del'>Delete</button></div></td>
    </tr>
    <tr>
        <td><div>2</div></td>
        <td><div>Johnas</div></td>
        <td><div><button class='del'>Delete</button></div></td>
    </tr>
    <tr>
        <td><div>3</div></td>
        <td><div>Coolio</div></td>
        <td><div><button class='del'>Delete</button></div></td>
     </tr>
</table>
注:

我在TD中使用了一个DIV来实现跨浏览器的slideUp效果。有些浏览器不会直接滑动TR。 整个脚本基于effects回调函数-如果不想使用effects,可以删除div并直接删除TR。 如果您使用的是动态表,那么动态添加的行并没有全部显示在DOM ready上,只需使用.on'click'而不是.click I used。 玩得开心

<div class='popup' id='popup' style='display:none'>
    <div>
        <p>Please confirm the delete action</p>
        <button id='confirm'>Proceed</button>
        <button id='cancel'>Cancel</button>
    </div>
</div>
$(function(){

//element to delete:
   var ele_del;

// Expose popup message when del button clicked:
   $('button.del').click(function(){
       event.preventDefault();
           $('#popup').fadeIn('slow');
           ele_del = $(this).closest('tr');
       return false;
    });

//delete if proceed clicked:
    $('button#confirm').click(function(){
        event.preventDefault();
            $('#popup').fadeOut('slow',function(){
               $(ele_del).find('div').each(function(){
                   $(this).slideUp('slow',function(){
                      $(ele_del).remove();
                      ele_del = "";
                   });
                });
             });
         return false;
    });

//cancel delete operation:
    $('button#cancel').click(function(){
        event.preventDefault();
            $('#popup').fadeOut('slow',function(){
                ele_del = "";
            });
        return false;
     });
});