テーブルがあり、テーブルには、ユーザーが「ユーザーの編集」をクリックすると展開される非表示の行 (内部に div がある) があります。これらの行の 1 つだけを一度に表示するようにしましたが、「ユーザーの編集」から「閉じる」までボタンを更新する必要がありますが、開いている行に対してのみです。したがって、ユーザーが別の「ユーザーの編集」ボタンをクリックすると、開いていたボタンが閉じ、ボタンのテキスト (およびスパン アイコン) が元の状態に戻り、開いている行が「閉じる」に更新されます。 . 私はこれを明確にしたことを願っています.
トグルを使用してみましたが、理解できないようです。私はJqueryを初めて使用しますが、これは現時点で私のスキルには少し高度すぎるようです!
これまでの私のJqueryは次のとおりです。
$(function() {
$.fn.slideFadeToggle = function(speed, easing, callback) {
return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);
};
$('tr:nth-child(4n)').addClass("zebra")
.prev().addClass("zebra")
.prev().addClass("normal")
.prev().addClass("normal");
$('.hidden-user').hide()
$('td .button-small').click(function(e) {
e.preventDefault();
e.stopPropagation();
var toggledelement = $(this).closest('tr').next().find('.hidden-user');
$(toggledelement).slideFadeToggle('slow');
$('.hidden-user').not(toggledelement).slideUp('slow');
});
});
ここに jsfiddle へのリンクがあります。プロジェクトで使用しているほとんどの css と html を含めました。