0

AJAXを使用してページBを呼び出すページAがあります。ページBはページAのdivコンテナに配置されます。結果(ページB)内に、jQueryUIダイアログを開始するコードがあります。ダイアログのdivもページBにあります。ただし、機能しません。開始コードをページAに配置する必要があります。したがって、開始コードをページBに配置する場合は、どうすればよいですか。

開始コード:


$('#dialog').dialog({
    bgiframe: true,
    autoOpen: false,
    width: 300,
    height: 300,
    modal: true,
    resizable: false,        
    buttons: {
        'Create an account': function() { },
         Cancel: function() { }
    },
    close: function() { }
});

セレクターとしても使用$('div.dialog')してみましたが(IDをクラスに変更)、機能しますが、ページBを要求するたびに(ページAをリロードせずに)、ダイアログが乗算されます。たとえば、最初にページBをリクエストしたときに、1つのダイアログが開きます。2回目にページBをリクエストすると、2つのダイアログが開きます。

4

2 に答える 2

1

あなたのアプローチはそれほど遠くありません、あなたは毎回ロードするときに呼び出しのダイアログを複製しているだけなので、前のダイアログを破棄します、それでこれの代わりに:

$('div.dialog').dialog({ ...options... });

これを呼んでください:

$('div.dialog').dialog('destroy').dialog({ ...options... });

これにより、同じ要素に対して複数のダイアログがインスタンス化されるのを防ぎます。または、次のように、その要素でダイアログがまだ作成されているかどうかを確認できます。

$('div.dialog').filter(function() {
  return $(this).closest('.ui-dialog').length === 0;
}).dialog({ ...options... });

これにより、ダイアログに<div class="dialog">まだラップされていない要素にのみダイアログが作成されます。

于 2010-05-09T13:17:59.393 に答える
0

カスタムイベントバインディングを備えたjQueryライブ関数を使用してこれを行うことができます。ページBを呼び出すたびに、カスタムイベントをトリガーして、新しいダイアログ要素をイベントハンドラーにバインドできるようにする必要があります。この方法に従う場合、開始コードはまだページAにある必要があります。

于 2010-01-18T09:06:37.540 に答える