1

パネルを切り替えるときに、開いている単語と非表示の単語を切り替えたい。

これが私が使用したコードです。非表示でのみ機能しますが、次にクリックすると開いて表示されません。

$(document).ready(function(){
        $(".flip1").click(function(){
            $(".panel1").slideToggle("slow");
       var val= 0;
       if(val==0){
        $('#word').html("hide").show();
        val=1;
       }else{
        $('#word').html("open").show();
        val=0;

       }
           // $(".info").hide();
        });
    });

これを修正するのを手伝ってください。

4

2 に答える 2

2

次の行を移動します。

var val= 0;

コールバックの外click()

クリック ハンドラー内のローカル変数であり0、ハンドラーが呼び出されるたびに設定されます。ハンドラーの外に移動すると、0一度初期化されてから、クリック ハンドラー内で更新されます。

または、その変数を完全に取り除き、次のようにします。

$(document).ready(function(){
    $(".flip1").click(function(){
        $(".panel1").slideToggle("slow");
        $("#word").html(function(i,oldHtml) {
           return oldHtml==="hide"?"show":"hide";
        }).show();
    });
});

デモ: http://jsfiddle.net/9S5eq/

編集:.html()メソッドにコールバックを渡すと、jQuery は jQuery オブジェクトの各要素に対してコールバックを呼び出し、オブジェクト内の現在の要素のインデックスとその要素の現在の html を渡します。html を、返された値に設定します。したがって、要素が 1 つしかないこの場合、index パラメーターは実際にはまったく必要ありませんが、現在の値が 2 番目のパラメーターで渡されるため、省略できません (iプレースホルダーのようなものです)。

于 2012-12-16T04:37:12.013 に答える
1

このコードを使用できます

 $(document).ready(function(){
    var val= 0;
    $(".flip1").click(function(){
        $(".panel1").slideToggle("slow");

   if(val==0){
    $('#Word').html("hide").show();
    val=1;
   }else{
    $('#Word').html("open").show();
    val=0;

   }
       // $(".info").hide();
    });
});

var val=0のクリックイベントの前に使用する必要があります.flip1

于 2012-12-16T05:20:28.780 に答える