0

私は興味深い癖に出くわし、誰かがそれを理解するのを手伝ってくれるかどうか疑問に思っていました. 以下のように、単純な JavaScript 駆動のトグル ボタンdisplay:noneは、トグルされた要素の がインラインに含まれている場合に美しく機能します。ただし、CSS ステートメントを<style>ヘッダーのタグまたは別の CSS ファイルに移動すると、2 回目のクリックでのみトグルが開始され、それ以降は、1 回のクリックでトグルが正常に動作します。基本。JS 関数は次のとおりです。

<script>
    function openSec(ordinal) {
        var tab_name = "sec" + ordinal;
        if (document.getElementById(tab_name).style.display == "none") {
            document.getElementById(tab_name).style.display = "table";
        } else {
            document.getElementById(tab_name).style.display = "none";
        }
    }
</script>
4

1 に答える 1

0

CSS ステートメントが style タグにある場合、クリックされる DOM 要素の属性として存在しなくなります。ブラウザは引き続きスタイルを適用していますが、DOM 要素にはスタイル属性としての値がありません。したがって、最初のクリックではdisplay:noneがないため、それを追加し、2回目のクリックでテーブルに置き換えます。

ブラウザの開発ツール (または Firebug など) を使用して最初の HTML を調べ、最初のクリック後に再度調べると、違いがわかるはずです。

于 2013-05-02T00:02:30.537 に答える