私のプログラムでtoggle（）メソッドが正しく動作しないのはなぜですか？

Question

以下のコードを使用して、私はポップアップウィンドウを表示しています。私はアニメーションメソッドtoggle()を使用しました。しかし、ポップアップウィンドウは一度しか表示されません。理由は何ですか？どうすればこの問題を解決できますか？

コード：

$(document).ready(function() 
{ 
     $(".ishow").click(function() 
     { 
      var info=$(this).attr("id"); 
      var id=info.replace("/",""); 

      var cor=$(".rd"+id).offset(); 
      var x=cor.left; 
      var y=cor.top; 

      $.ajax 
      ({ 
       type:"post", 
       url:"roomstaypopup.php", 
       data:"id="+info, 
       success: function(html) 
       {       
        $("#popup"+id).css({"display":"block","left":x-51,"top":y+18}); 
        $("#popup"+id).toggle(); 
        $("#popup"+id).html(html); 
       } 
      }); 

     }); 
}) 

Answer 1

.toggle()の直前にスタイルを「表示」：「ブロック」に設定すると、.toggle()は常に要素を非表示にします。

"display":"block",を削除してみてください。また.toggle(500);のような期間を追加しない限り、.toggle()はアニメーション化されません。しかし、あなたの目的のために、.toggle(500);の代わりに.show();を使用し、show();またはtoggle();への呼び出しの前に$("#popup"+id).html(html);を入れて、アニメーションの開始前にhtmlが挿入されていることを確認してください。

Answer 2

私はトグルが最終的に表示CSSの属性を変更するかなり確信しています。 #popup + idの.css設定がトグルに干渉していないことを確認してください。

トグルは、最初のクリックを表示し、次のクリックを非表示にする必要があります。しかし、toggle（）がトリガーされる直前にCSSで表示すると、毎回オフに切り替えることがあります。

上記のトグル（）の行をコメントアウトしてください。とにかくそれは私の推測です。

Answer 3

トグルは、可視性に応じて要素を表示または非表示にするため、言い換えれば機能します。あなたの場合は、display = blockの要素でそれを呼び出すので、常にdisplayをnoneにするように設定する必要があります。