1

私が持っているもの：

jQuery を使用して、順序付けされていないリストの最後のいくつかのリスト項目を非表示にしています。

私の問題：

リスト アイテムは、ページが読み込まれて jQuery が起動するまでページに表示されます (これは望ましくありません)。

編集: HTML を編集できません。クラスを選択的に追加できないため、純粋な CSS に依存することはできません。jQuery セレクターを使用して、最後の 2 つのリスト項目をターゲットにしています。

私のコード:

hide() 関数を使用するか addclass() + display:none を使用するかに関係なく、同じ問題が発生します。

<ul id="some_menu">
    <li><a href="#">Enkidu</a></li>
    <li><a href="#">Gilgamesh</a></li>
    <li><a href="#">Epic</a></li>
    <li><a href="#">Sumeria</a></li>
    <li><a href="#">Anunnaki</a></li>
</ul>

<script type="text/javascript">
    jQuery(document).ready(function() {
        //jQuery('ul#some_menu li:gt(2)').addClass("hide_menu_link");
        jQuery('ul#some_menu li:gt(2)').hide();
    });
</script>

<style type="text/css">
    .hide_menu_link{
        display:none;
    }
</style>

問題を再現しませんが、JSFIDDLE のコードは次のとおりです。http://jsfiddle.net/dominornovus/pB8Mb/2/

4

3 に答える 3

4

を使用jQuery(document).readyすることで、実行する前にドキュメントの準備が整うまで待機するよう jQuery に指示します。したがって、実際には、アクションを実行する前に、ページの準備が整う (ロードされる) のを待ちます。

他の人が言ったように、ページの開始時に一部のアイテムを非表示にし、他のアイテムを使用できるようにする場合は、ロジックを逆にして、すべてを非表示にしてから、ドキュメントの準備ができたときに表示したいものを表示する必要があります.

于 2012-10-21T23:18:57.327 に答える
1

ロード時にこれらの要素を非表示にする場合は、CSSを使用してこれらの要素を非表示にする必要があります。一般に、ページが読み込まれるまで待ってからjavascriptで操作を開始することをお勧めします。そうしないと、非表示にしようとしている要素がまだ読み込まれていない可能性があります。

要件に応じて、CSSでそれらを非表示にする方法はいくつかあります。

display: none;呼び出したときにjQueryがインラインスタイルとして設定しているものです.hide()

于 2012-10-21T23:14:44.970 に答える
0

問題は、jQueryがクライアント側で実行されるためです。したがって、最初にコードがサーバーから取得され、DOMが読み込まれて準備ができた後、jQueryが実行されると、サーバーに表示されます。サーバー側の言語から、またはcssルールを使用して非表示にします。

于 2012-10-21T23:16:05.940 に答える