0
対応するdivまたはtdに一致させるためにhref idを使用するjs関数を切り替えることができます。divを複数回通して切り替えます。<a>タグ - Jquery/Javascript
私の目標は、div/tdをページの下部にある別のhrefと切り替えることができるようにすることです。このhrefには同じIDと名前が含まれています。ここで
は一例です:jsfiddle(トグル機能が私のリモートサーバーで動作しますが、それはjsfiddleに何とかしない)
<script type="text/javascript">
function showonlyonev2(thechosenone) {
var newboxes = document.getElementsByTagName("div");
for(var x=0; x<newboxes.length; x++) {
name = newboxes[x].getAttribute("name");
if (name == 'newboxes-2') {
if (newboxes[x].id == thechosenone) {
if (newboxes[x].style.display == 'block') {
newboxes[x].style.display = 'none';
}
else {
newboxes[x].style.display = 'block';
}
}else {
newboxes[x].style.display = 'none';
}
}
}
}
</script>
<table>
<tr>
<td>
<div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px;">
<a id="myHeader1-2" href="javascript:showonlyonev2('newboxes1-2');" >toggle</a>
</div>
<div name="newboxes-2" id="newboxes1-2" name="div1" style="border: 1px solid black; background-color: #CCCCCC; display: block;padding: 5px;">Div #1</div>
</td>
<td>
<div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px;">
<a id="myHeader2-2" href="javascript:showonlyonev2('newboxes2-2');" >toggle</a>
</div>
<div name="newboxes-2" id="newboxes2-2" name="div2" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px;">Div #2</div>
</td>
<td>
<div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px;">
<a id="myHeader3-2" href="javascript:showonlyonev2('newboxes3-2');" >toggle</a>
</div>
<div name="newboxes-2" id="newboxes3-2" name="div3" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px;">Div #3</div>
</td>
</tr>
</table>
<div style="padding-top:20px;">
<a id="myHeader1-2" name="div1" href="javascript:showonlyonev2('newboxes1-2');">See Div #1</a>
</div>
<div style="padding-top:20px;">
<a id="myHeader2-2" name="div2" href="javascript:showonlyonev2('newboxes2-2');">See Div #2</a>
</div>
<div style="padding-top:20px;">
<a id="myHeader3-2" name="div3" href="javascript:showonlyonev2('newboxes3-2');">See Div #3</a>
</div>
ヘッドオンボディではなく、オンロードに設定されていたので動作しませんでした。 [固定されたフィドル](http://jsfiddle.net/X8U82/16/) – epascarello