0

以前にこのようなことをしたことがありますが、今回はコードが機能しません。基本的に、ユーザーが html のボックスのオンとオフを切り替えられるようにしたいと考えています。ここにjsfiddleがあります

http://jsfiddle.net/2pcwW/

これにはいくつかの問題があります。まず、おそらくタイプミスが原因で機能しません。第二に、これがしようとしていることとは逆に、デフォルトでテキストを表示するのではなく、非表示にすることを望みます。最後に、「一部のテキスト」の代わりに、テーブル全体のオンとオフを切り替えるように、div 内にテーブルを配置することは可能ですか。

これは動作しないコードです..jsfiddleと同じです。

JS:
function toggleBox(obj) {
            var box = document.getElementById("box");
            if (box.style.display == "none") {
                box.style.display = "";
                obj.innerHTML = <div>Hide</div>;
            } else {
                box.style.display = "none";
                obj.innerHTML = <div>Show</div>";
            }
        }
html:
<table><tr><td><div>
<a href="javascript:void(0)" onclick="toggleBox(this);"><div>Hide</div></a><div id="box">
Some text</div></div></td></tr></table>

提案をありがとう。

4

1 に答える 1

2

JavaScript を使用しなくても (:target疑似セレクターを実装するブラウザーのみをサポートしている場合):

<table>
    <tr>
        <td>
            <div>
                <a href="#box">
                    <div>Hide</div>
                </a>
                <div id="box">
                    Some text. <a href="#">Hide</a></div>
            </div>
        </td>
    </tr>
</table>

そしてCSS：

#box {
    display: none;
}

#box:target {
    display: block;
}​

JS フィドルのデモ。

于 2012-07-08T16:21:26.760 に答える