1

私はサイトの周りを見回しましたが、私が望む答えを見つけることができませんでした. 私の知識はこれには少なすぎるかもしれませんが、もっともっと学ぼうとしています。

これが問題です。私はいくつかの映画を含むこのウェブサイトを持っており、データベースで検索を行った後、検索パラメーターに対応する映画を含むユーザーに不可欠なデータのみを返します。残りのデータは、同じdivを表示および非表示にするオプションを備えたdiv。

それは私がこれまでに持っているものです:

<script type='text/javascript'>
function showDiv() {
   document.getElementById('hiddenDiv').style.display = "block";
}
</script>

<div id="hiddenDiv"  style="display:none;" class="answer_list" > WELCOME</div>
<input type="button" name="answer" value="Show Div" onclick="showDiv()" />

詳細: すべてを php echo で印刷しています。

どうもありがとうございました！

追加情報：

すべての結果が同じページに表示されます。これは、すべての div が同じ名前であることを意味します。

div コードを次のように変更しました。

echo "<div id='$dados[id]'  style='display:none;' class='answer_list' >";

$dados[id] returns me the id of the data in my db.

I want to change:

document.getElementById('hiddenDiv') to something like document.getElementById('$dados[id') <-- Shows only the last div.

それはできますか？

結果は次のとおりです。

while ($dados = mysql_fetch_array($query))
4

4 に答える 4

1

これを試して：

<script type='text/javascript'>
    function showDiv() {
        if (document.getElementById('hiddenDiv').style.display == 'block') {
            document.getElementById('hiddenDiv').style.display = 'none';
        } else {
            document.getElementById('hiddenDiv').style.display = 'block';
        }
    }
</script>
<div id="hiddenDiv"  style="display:none;" class="answer_list" >
    WELCOME
</div>
<input type="button" name="answer" value="Show Div" onclick="showDiv()" />

1 つの機能ですべてを実行できます。そうは言っても、jQueryトグルは本当に素晴らしいです。

于 2013-01-07T17:43:35.913 に答える
0

サンプル Javascript + Html:

<script language="javascript"> 
function toggle() {
    var ele = document.getElementById("toggleText");
    var text = document.getElementById("displayText");
    if(ele.style.display == "block") {
        ele.style.display = "none";
        text.innerHTML = "show";
    } else {
        ele.style.display = "block";
        text.innerHTML = "hide";
    }
} 
</script>

<a id="displayText" href="javascript:toggle();">show</a> <== click Here
<div id="toggleText" style="display: none"><h1>peek-a-boo</h1></div>

注: 「トグル」という用語は、要素の表示/非表示を表します。

また、他の良い例を次に示します。

http://csscreator.com/node/708#xcomment-3123

http://psoug.org/snippet/Javascript-Smooth-Div-ShowHide_236.htm

于 2013-01-07T17:54:34.080 に答える
0 
<script type='text/javascript'>
function showadve() {
    if (document.getElementById('hiddenadve').style.display == 'none') {
        document.getElementById('hiddenadve').style.display = 'block';
    } else {
        document.getElementById('hiddenadve').style.display = 'none';
    }
}
</script>
<div id="hiddenadve" class="answer_list" >
    WELCOME
</div>
<input type="button" name="answer" value="Show Div" onclick="showadve()" />
<a href="#" onclick="showadve()">all close</a>`

それは私のものです

于 2013-11-20T04:29:52.050 に答える
0 
<script type='text/javascript'>
function showDiv() {
   document.getElementById('hiddenDiv').style.display = "block";
   document.getElementById('showDivButton').style.display = "none";
}
function hideDiv() {
   document.getElementById('hiddenDiv').style.display = "none";
   document.getElementById('showDivButton').style.display = "block";
}
</script>

<div id="hiddenDiv"  style="display:none;" class="answer_list" >
  WELCOME
  <input type="button" id="hideDivButton" value="Hide Div" onclick="hideDiv()" />
</div>
<input type="button" id="showDivButton" value="Show Div" onclick="showDiv()" />

または、Dojo などのフレームワークを使用する (どうしても仕方がない場合は jQuery でさえ)

于 2013-01-07T17:43:25.410 に答える