1

リンクをクリックした後にのみ表示したいテーブルを含むphpページがあります。

私の問題は次のとおりです。display = "none"に設定されたdivがあります

<div name="details" style="display:none;">

JavaScriptを使用して、インラインテーブルに変更するか、単にブロックするかは問題ではありません。

function showDetails(){
        var elems = document.getElementsByName("details");
        document.getElementById("dis").innerHTML = elems.length;
        for (var i=0; i<elems.length; i++)
            elems[i].style.display = "inline-table";
    }

このスクリプトをトリガーするリンクをクリックすると、div コンテンツがほんの一瞬表示され、再び消えます 。 SRFile2012_9_9_22_43_58_463.avi

表示プロパティの変更に関するGoogleリンクの5〜6ページをチェックし、もちろんstackoverflowをチェックしましたが、関連する回答が見つかりませんでした...

誰も手がかりを持っていますか？

前もって感謝します！

PS ここに私の完全なコードがあります: http://codeviewer.org/view/code:299e

4

3 に答える 3

3

通常はリンクに使用されるタグをクリックしていて<a>、別のページに移動できることを忘れないでください (まさにそれが起こっています)。href 属性が空であるため、クリックするとページが更新されます。

これを試して： <a href="" onclick="showDetails();return false;">show details</a>

注意してくださいreturn false;。これにより、デフォルトのアクションがキャンセルされます。

于 2012-09-09T19:59:51.487 に答える
0

このnameプロパティは、そのように使用することは想定されていません (実際には、非推奨であり、フォーム フィールド以外では使用しないでください)。コードを次のように変更します。

<table class="details">

そして、これを使用してそれらを見つけます：

var elems = document.getElementByClassName("details");

また、表示プロパティを設定するときは、「none」を使用して要素を非表示にし、空の文字列のみを使用してブラウザーのデフォルト値に戻す必要があります (ブラウザーによって異なる場合があります)。

elem.style.display = ""; // remove "none" value to make it visible.

getElementByClassName 機能は、古いブラウザーには存在しません。Google で簡単に検索すると、すべてのブラウザーで動作するサンプル コードが見つかります。

また、@Lian は正しいです。onclick で false を返す必要があります。

于 2012-09-09T20:02:14.597 に答える
0

あなたが提供したリンクのあなたのコードは、ここでSOに投稿したものとは異なることを言っています。他のコードでは、可視性を可視のみに変更することを示しています。視認性はディスプレイよりも優先度が低いです。可視性はあるが表示がまだ何もない場合、それは表示がまだ何もないため、物がまだ見えないことを意味します。可視性を完全に忘れて、display none のみを display ブロックに変更する必要があります。

于 2012-09-09T20:02:14.737 に答える