1

当用户单击行内的特定按钮并将其一次又一次地附加到另一个表时，我想分离一行。

我的下面的脚本分离并附加另一行一次。但是，它会在随后的点击中继续切换类，它不会进行分离和附加。它也无法更新数据库。

这个片段有什么问题？

$('.orderHideBtn').on('click',function(){
    var $oid = $(this).attr('id').split('-');
    $data = 'a=hideOrder&oid='+$oid[1];
    $.ajax({
        data: $data,
        success: function(msg){
            $('#hbtn-'+$oid[1]).toggleClass("orderHideBtn orderShowBtn").toggleClass('icon-eye-close icon-eye-open').closest('tr').detach().appendTo('#ordersTBody2');
            console.log('#hbtn-'+$oid[1]);
        }
    });
});
$('.orderShowBtn').on('click',function(){
    var $oid = $(this).attr('id').split('-');
    $data = 'a=showOrder&oid='+$oid[1];
    $.ajax({
        data: $data,
        success: function(msg){
            $('#hbtn-'+$oid[1]).toggleClass("orderShowBtn orderHideBtn").toggleClass('icon-eye-open icon-eye-close').closest('tr').detach().appendTo('#ordersTBody1');
            console.log('#hbtn-'+$oid[1]);
        }
    });
});

这些是 HTML 按钮：

<span id="hbtn-{$o.orderID}" class="orderHideBtn icon-eye-close"></span>

和

<span id="hbtn-{$o.orderID}" class="orderShowBtn icon-eye-open"></span>
4

1 回答 1

1

由于您正在切换类并且相对于 hanlder 的选择器未重新评估，因此您应该委托事件，例如：

$(document.body).on('click','.orderHideBtn',function(){
    var $oid = this.id.split('-');
    $data = 'a=hideOrder&oid='+$oid[1];
    $.ajax({
        data: $data,
        success: function(msg){
            $('#hbtn-'+$oid[1]).toggleClass("orderHideBtn orderShowBtn").toggleClass('icon-eye-close icon-eye-open').closest('tr').appendTo('#ordersTBody2');
            console.log('#hbtn-'+$oid[1]);
        }
    });
});

我删除了 detach() 方法，因为据我所知，它在这里没用。

于 2013-09-16T15:22:24.380 回答