1

ネストされたモーダルのサポートが必要なため、jqModal の使用を開始しました。ネストされたモーダルと AJAX の動作が不安定なことに気付きましたが、正確な修正方法がわかりません。ネストされたモーダルを含むメインモーダルをロードすると、2 つの jqmOverlay div が取得されます。ネストされたモーダルがまだトリガーされていないにもかかわらず、両方のモーダルにオーバーレイを適用しているようです。そのため、モーダルを閉じると、まだ 1 つのオーバーレイが表示されています。コードは次のとおりです。

// Main Modal
$(function(){
  $("#modal").jqm({ajax:'@href'});
});
<a class="label jqModal" href="/suppliers/2/edit">View Supplier</a>


// Nested Modal code fragment within the /suppliers/2/edit html
$(function(){
  $("#nested_modal").jqm({ajax:'@href', zIndex:3001});
})
<a class="button jqModal" href="/suppliers/6/bills/new">Add Bill</a>

初めて動作するようですが、メインモーダルを閉じてから再度開くと、二重オーバーレイの問題が発生します。これはバグですか？または、ネストされたモーダルを呼び出す方法は? また、ネストされたモーダルで jqm 呼び出しを削除すると、メインのモーダルが毎回正常に動作するため、ネストされたモーダルと関係があることもわかっています。

4

1 に答える 1

4

ネストされた AJAX jqModals でも同様の問題がありました。これが解決策です: z-indexと組み合わせたtoTopパラメータ。

ネストされたモーダルのz-indexを高く設定し、JQM の作成時にtoTopを true に設定します。例えば：

// Nested:
<div id="test" style="z-index: 5000;">Test content</div>
...
<script type="text/javascript">
$.ready(function(){
    $('#test').jqm({
    toTop:                  true,
    modal:                  true,
    overlay:                10,
    });
});
</script>

z-indexと toTop パラメータをいじると、問題の解決に役立ちます。

于 2009-05-01T21:59:03.093 に答える