1

次のコード（CSS-Tricksから削除）があり、それに別のdiv（モーダルウィンドウ）を追加したいのですが、これを機能させることができないようです。ストックモーダルdivはすでにDOMに存在しますが、＃overlay divが存在する場合にのみ表示したいので、現在は非表示になっています。

$('.stock-check').on('click', function () {

    var docHeight = $(document).height();

    $('body').append('<div id="overlay" />');
    $('#overlay').height(docHeight).css({
        'opacity': 0.7,
        'position': 'absolute',
        'top': 0,
        'left': 0,
        'background-color': 'black',
        'width': '100%',
        'z-index': 10000
    });

    $('<div class="stock-modal" />').appendTo('#overlay').show();

});

これを実行すると、オーバーレイdiv内に空のストックモーダルdivが挿入されますが、DOMに存在するものは挿入されません。私は何が間違っているのですか？

4

3 に答える 3

2

新しい div を作成しないでください。最初に既存のものを選択して追加します。

$(".stock-modal").appendTo('#overlay').show();
于 2012-10-25T12:38:40.660 に答える
1

に変更する必要があります。最初に既存の.stock-modaldiv と appendTo を選択します#overlay

$('.stock-modal').appendTo('#overlay').show();
于 2012-10-25T12:38:51.313 に答える
0

オーバーレイ div が既に存在するかどうかを確認し、モーダルを追加するだけです。それ以外の場合は、オーバーレイを作成してモーダルを追加します。

$('.stock-check').on('click', function () {

 var docHeight = $(document).height();

if($('#overlay').length > 0)
{
  $('<div class="stock-modal" />').appendTo('#overlay').show();
}
else
{
 $('body').append('<div id="overlay" />');
 $('#overlay').height(docHeight).css({
    'opacity': 0.7,
    'position': 'absolute',
    'top': 0,
    'left': 0,
    'background-color': 'black',
    'width': '100%',
    'z-index': 10000
 });

 $('<div class="stock-modal" />').appendTo('#overlay').show();
}

});
于 2012-10-25T12:47:22.437 に答える