jquery - jquery BlockUI プラグインを使用してテーブル行をブロックする

Question

テーブルの行をブロックしようとしていますが、ブロックできません。jquery プラグイン blockUI を使用しています。

私のコード:

var dis_tr = $("input[name=abc]").closest('tr')
dis_tr.block({message: null});

誰でも私を助けることができますか？

Answer 1

問題は、テーブルの場合、td 要素間以外には何も書き込めないことでした。また、行全体をブロックすることはできません。これの代わりに、各 td 要素をブロックする必要があります。このために、blockUI のブロック/ブロック解除機能を使用する新しい関数を作成しました。

// Functions added to block/unblock table rows by using blockUI jquery library
$.fn.block_row = function(opts) {
    row = $(this)
    height = row.height();
    $('td, th', row).each(function() {
        cell = $(this);
        cell.wrapInner('<div class="holderByBlock container" style="width:100%; height: ' + height + 'px; overflow: hidden;"></div>');
        cell.addClass('cleanByBlock');
        cell.attr('style', 'border: 0; padding: 0;')
        $('div.holderByBlock', cell).block(opts);
    })
};

$.fn.unblock_row = function(opts) {
    row = $(this)
    $('.cleanByBlock', row).each(function() {
    cell = $(this);
    $('div.holderByBlock', cell).unblock({
        onUnblock: function(cell, opts) {
            this_cell = $(cell).parent('td, th');
            this_cell.html($('.holderByBlock', this_cell).html());
            this_cell.removeAttr('style');
            this_cell.removeClass('cleanByBlock');
        }
    });
    })
};

Answer 2

コンソールにエラーはありますか? 私は blockUI を使用したことがないので、あまり役に立たないと思いますが、見ているだけで、代わりにこれを試すことをお勧めします。

var dis_tr = $('input[name="abc"]').closest('tr');
dis_tr.block({message: null});