0

jqueryをまとめて非表示のdivを表示し、同時に親divを更新して、javascriptが新しい高さを修正して表示できるようにしようとしています。

これは私がこれまでに持っているものですが、divを更新するよりもいくつかの調査が判明した後、ajaxを使用する必要があり、誰かが手を貸すことができるかどうか疑問に思っていました.

var $r = jQuery.noConflict();
  $r(document).ready(function() {
      $r('#open').click(function () {
        $r('#expandable-2').show('slow');
        $r(this).load(location.href + '.panel > *');
      });
       $r('#close').click(function () {
        $r('#expandable-2').hide('1000');
        $r(this).load(location.href + '.panel > *');
      });
  });

これまでのところ、私はこれを持っています、

  • open と close の ID とのリンク
  • クリックすると、表示ブロックの css プロパティが与えられ、何も表示されずに div expandable-2 に表示されます
  • 私が立ち往生している部分は、表示されたdivを正しく表示するために親div .panelをリフレッシュすることです。

その理由は、現在ページで CodaSlider スクリプトを使用しており、コンテナー内のコンテンツの量に応じて高さが動的に取り込まれるためです。クリックして開いたときに新しいコンテンツが表示されるようにするには、コンテナーを更新して、新しいコンテンツを新しい高さで表示する必要があります。

それが理にかなっていることを願っていますが、どんな助けも素晴らしいでしょう.

4

3 に答える 3

1

あなたがする必要があるdivを「リフレッシュ」するには：

document.getElementById("myDiv").innerHTML = new_content;

new_content は ajax 呼び出しによって返される html である可能性がありますが、div を「更新」するために ajax 呼び出しは絶対に必要ありません。

于 2012-09-19T11:14:49.910 に答える
0

htmljQueryのメソッドでdivのhtmlを変更できます。

$r(".content-div").html("Hello world");

ajax を使用してサーバーから html をロードする場合は、次のようにload関数を使用する必要があります。

$r(".content-div").load("ajax/users.html");
于 2012-09-19T11:21:11.600 に答える
0

あなたのコードには明らかな混乱があります。いくつかのヒント:

  • 親 div に #expandable-2 が含まれている場合、ajax 呼び出しを実行してアニメーションを一度に表示することはできません。これは、ajax 呼び出しが #expandable-2 要素の表示/非表示中に破棄されるためです。

  • ajax を介して外部コードを div にロードする適切な方法は次のとおりです。

    $r('.panel').load('/path/to/url');

    これにより、「/path/to/url」の応答が「.panel」div に読み込まれます。'/path/to/url' が div の新しいコンテンツのみを返すことを確認してください。それ以外の場合は $r('.panel').load を使用できませんが、代わりに間接的なアプローチを使用する必要があります (例: $r.ajax)。 )

于 2012-09-19T11:22:16.833 に答える