4

ajax呼び出しからコンテンツを受信して​​いるdivがあります。今、私はajaxコールバックハンドラーでこれを行っています：

function searchCallback(html) { $("#divSearchResults").html(html); }

これにより、コンテンツがページに「ポップ」し、非常に突然になります。.slideToggle（）メソッドのように、divを適切にサイズ変更する方法はありますか？

4

4 に答える 4

4

非表示になっていることを確認してから、コンテンツを追加してスライドさせます。

$("#divSearchResults").hide();
$("#divSearchResults").html(html);
$("#divSearchResults").slideDown();

または、フェードインすることもできます：

$("#divSearchResults").fadeIn();

コンテンツが表示されたときにページが「爆発」しないようにするには、div が非表示になっていることを確認してください。また、コンテンツが追加されたら、ページが正常に表示されることを確認してください。

于 2009-03-26T19:51:41.767 に答える
2

そもそもそれを隠しておくことができます。次に、htmlを挿入し、その機能が完了したら、表示効果を実行します。（slideToggleのように）

于 2009-03-26T19:48:55.767 に答える
1

これが機能するかどうかはわかりませんが、試す価値はあります。

  • 現在のdivサイズを調べて、固定に設定します。
  • HTMLを更新する
  • 高さと幅を「自動」にアニメーション化します。
于 2009-03-26T19:50:26.790 に答える
1

もちろん、これを試すことができます：

function searchCallback(html) {
    var html_hidden = $('<div style="display:none;" class="hidden_insert">'+html+'</div>');
    $('#divSearchResults').html(html);
    $('#divSearchResults .hidden_insert').slideDown('medium');
}

最も美しいものではありませんが、うまくいくでしょう。クラス 'hidden_​​insert' の CSS スタイルを作成して、そのクラスの要素をデフォルトで非表示にすることで、きれいにすることができます。また、この日付の送信元であるバックエンドでは、JavaScript の代わりにそこでラッピングを行うことができます。スクリプトは次のように簡略化できます。

function searchCallback(html) { 
    $('#divSearchResults').html(html).find('.hidden_insert').slideDown('medium');
}

これらのいずれもテストしていませんが、動作するはずです。

于 2009-03-26T19:58:17.553 に答える