jquery のヘルプが必要です。
これは、中央に jquery UI タブ セクションを含むテーブルです。表の行は現在、「onclick」で UI タブを表示/非表示にします。
私が解決する必要があるのは、ページが読み込まれた後にテーブルの行が「非表示」のタブ付きセクションを自動的に非表示にし、ユーザーがクリックして通常のようにタブを展開できるようにすることです。誰かがこの問題を簡単に解決できますか?
私のスクリーン キャストのデモンストレーションをご覧ください: http://screencast.com/t/AAxUitL9O7
HTML/Jquery で私のフィドルをチェックしてください: http://fiddle.jshell.net/rk7y4/11/
これは現在の実装です:
function CollaspeAll() {
if ($(".ChildRow")[0]) {
$('tr.ChildRow').children('td').each(function () {
$(this).children('div').each(function () {
if ($(this).css('display') == 'block') {
$(this).css("display", "none");
}
});
});
}
$('img').each(function () {
if ($(this).attr('src') == 'http://imageshack.us/scaled/landing/834/minusl.png') {
$(this).attr('src', 'http://img338.imageshack.us/img338/6042/plusk.png');
}
});
}
function ExpandCollapse(TESTID) {
$('#tabs' + TESTID).tabs();
if ($('#div' + TESTID)) {
// Is already ChildGrid shown. If not shown
if (!isDisplayed($('#div' + TESTID))) {
if ($('#hid' + TESTID).val() == '0') {
$('#div' + TESTID).css("display", "block");
$('#img' + TESTID).attr('src', 'http://imageshack.us/scaled/landing/834/minusl.png');
$('#hid' + TESTID).val("1");
}
else {
$('#div' + TESTID).css("display", "block");
$('#img' + TESTID).attr('src', 'http://imageshack.us/scaled/landing/834/minusl.png');
}
}
else { // Already Child Grid Shown
$('#div' + TESTID).css("display", "none");
$('#img' + TESTID).attr('src', 'http://img338.imageshack.us/img338/6042/plusk.png');
}
}
}
function isDisplayed(object) {
// if the object is visible return true
if ($(object).css('display') == 'block') {
return true;
}
// if the object is not visible return false
return false;
};
$(".hand").hover(function () {
$(this).addClass("blue");
}, function () {
$(this).removeClass("blue");
});