javascript - JQuery Toggle（）

Question

JQueryトグルを使用するためのチュートリアルを見ていましたが、自分のサイトで使用したいのですが、最初はページの読み込み時にdivを非表示にしたいので、誰かがページにアクセスすると、ボタンがいくつか表示されるだけです。コンテンツを表示するテキスト。そのボタンをクリックすると、コンテンツを切り替えて表示しますが、私は新しいので、デフォルトの開いた状態を停止する方法がわかりません。

function random_script(element,speed){
$(element).toggle(speed);
}

<input type="button" value"Show Results?" onClick="random_script('#somediv',1000);"/>
<div id="somediv"></div>

それで、これに対する解決策はありますか？

Answer 1

<a href="javascript:void(0)" onClick="random_script('#somediv',1000);">Show Results?</a>
<div id="somediv" style="display:none;"></div>

JQueryの代替手段（jsfiddle）：

<script type="text/javascript">
    ​$('.showResult')​.click(function (){
        $(this).next('.result').toggle();
    });​​​​​​
</script>
<style>
    ​.result {
        display: none;
    }​
</style>

<a href="javascript:void(0)" class="showResult">Show Results?</a>
<div class="result">Some Result​​​​​​​​​​​​​​​​​​​​​​​​​​&lt;/div>​​​​​​​​​​​​​​​​​​​​​​

Answer 2

cssルールを追加する

#somediv{ display:none;}

Answer 3

最初の機能を逆にするにはtoggle()、最初にターゲット要素を非表示にする必要があります。あなたはそれに宣言することによってこれを達成することができます#somediv{display:none}。

これを行うtoggle()と、要素が表示されます。

ここにフィドルの例があります。

また、インラインのイベント属性を使用するのではなく、実際のイベントハンドラーを使用する必要があります。

$("input").on("click".function(){
   random_script("#somediv",1000);
});

function random_script(element,speed){
    $(element).toggle(speed);
}

正しい方法です。

Answer 4

{}for関数を見逃しました。

function random_script(element,speed) {
  $(element).toggle(speed);
}