このコードで、 [Maintenance] ボタンをクリックすると最初のアラートに正しいフィールドセットの ID が表示され、[Subfile maint] ボタンをクリックすると 2 番目のアラートに正しいフィールドセットの ID が表示されるのに、その逆は表示されない理由を説明してください。
<div>
<table width="100%">
<col width="25%" />
<col width="75%" />
<tr>
<td>
<div class="width300"><h1>Inandrias Software®</h1></div>
</td>
<td>
<div class="nopadormarg" style="white-space:nowrap;">
<h1><font size=+1>You are logged in as </font>charlie<font size=+1> of New Enterprises (Pty) Ltd.</font></h1>
</div>
</td>
</tr>
</table>
<div id="menudiv" class="nopadormarg">
<a href="#" class="menuA" name="level01"><span>Maintenance</span></a>
<fieldset id="Maintenance" class="menuAbuttons">
<p>
<a href="#" class="menuA" name="level02" title="Maintain ancilliary files"><span>Subfile maint</span></a>
<fieldset id="Subfilemaint" class="menuAbuttons">
<p>
<a href="#" class="menuA" name="level03" title="Add, amend, delete (unused) Products"><span>Products</span></a>
</p>
<p>
<a href="#" class="menuA" name="level03" title="Add, amend, delete (unused) Insurers"><span>Insurers</span></a>
</p>
<p>
<a href="#" class="menuA" name="level03" title="Add, amend, delete (unused) Section types"><span>Section types</span></a>
</p>
<p>
<a href="#" class="menuA" name="level03" title="Add, amend, delete (unused) Agents"><span>Agents</span></a>
</p>
<p>
<a href="#" class="menuA" name="level03" title="Add, amend, delete (unused) Pay methods"><span>Pay methods</span></a>
</p>
</fieldset>
</p>
</fieldset>
</div>
</div>
JS:
$(document).ready(function() {
$(".menuA").click(function(evnt) {
evnt.preventDefault();
alert("next fieldset id = " + $(this).next('fieldset').attr('id'));
alert("next fieldset id = " +
$(this).closest('fieldset').find(".menuAbuttons:first").attr('id'));
// remove the menuA-open class from the current and lower (numerically higher) level's
// class menuA objects except the one being clicked (toggled)
var level = $(this).attr('name');
// trying to avoid higher levels with >= doesn't seem to work
// nor does "[name = " + level + "][name > " + level + "]"
$(".menuA").not(this).filter("[name = " + level + "]").removeClass("menuA-open");
//this removes all menuA-open classes except the currently clicked one
//$(".menuA").not(this).removeClass("menuA-open");
// hide all other fieldset objects except the one being toggled
$('fieldset').not($(this).next('fieldset')).hide();
// toggle the fieldset following this link open or closed
$("fieldset#" + $(this).text().replace(/\s+/gi,'')).toggle();
// toggle the currently selected menuA-open class on or off
$(this).toggleClass("menuA-open");
});
});
</p>