javascript - Internet Explorer は jQuery 関数を何度もトリガーし、間違ったタイミングでもトリガーします

Question

Web ページの中央に div を配置するコードを取得しました。コードはクロムでうまく機能しますが、何らかの理由で、IE（9または10だと思います）で初めて機能し、その後機能しません。

問題を示すために、いくつかの写真を示します: (理解できない記号は無視してください。それが私の言語です)

クロム：

IE で初めてオブジェクトをクリックして開きます。

IE で 2 回目以上、オブジェクトをクリックして開くと、次のようになります。

これは、divを中央に配置するために使用しているコードです:

    jQuery.fn.center = function ()
{
    this.css("position","fixed");
    this.css("top", ($(window).height() / 2) - (this.outerHeight() / 2));
    this.css("left", ($(window).width() / 2) - (this.outerWidth() / 2));
    return this;
}

関数を使用するコードcenter():

$('#products,#search-result').on("click",'.product-item-info',function() {
    var pid = $(this).find('input').val();
    $.get('product_info.php',{pid:pid},function(data){
        $('#product-lb').html(data).append('<span class="x"><span>X</span></span>');
        $('.x').click(function() {
            $('#dimmer').click();
        });

        $('#dimmer').css({width:$('html').width(),height:$('html').height()});
        $('#product-lb').center();
        $('#product-lb').show(800);
        $('#dimmer').show();
        $(window).resize(function() {
            $('#product-lb').center();
        });
    });
});

説明:

1. #products写真でわかるように、青と緑で色付けされたすべての div を含む div です。
2. .product-item-info各製品 DIV にある四角形のクラスです。

3. #dimmer黒の背景です

4. #product-lbページの中央に配置して表示する必要がある div です。

多くの潜在的なことをテストした後、私は手がかりを思いついた. 高さのプロパティを次のようにコンソールしようとすると:

    jQuery.fn.center = function ()
{
    console.log($(window).height());
    console.log(this.outerHeight());
    this.css("position","fixed");
    this.css("top", ($(window).height() / 2) - (this.outerHeight() / 2));
    this.css("left", ($(window).width() / 2) - (this.outerWidth() / 2));
    return this;
}

chrome、explorer を初めて使用した場合と、explorer を 2 回使用した場合の違いを確認しました。

Chrome - div コンソール ログを初めて開く:

Chrome - div コンソールを閉じた後:

Internet Explorer - 初めて div を開く:

ここで、奇妙な部分の最初のステップが始まります。div が閉じられているときに、関数がトリガーされているように見えるため、コンソールは次のようになります。

さて、これは私が見つけた最も気がかりなことです。表示する div を開こうとする 2 回目の試みで、コンソールを見てください。

そして、このdivを閉じた後:

div を開いて div を閉じるたびにイベントがトリガーされ、最大 4 ～ 5 回トリガーされるようです。

これは私の閉じる関数です:

    $('#dimmer').click(function() {

    $('#dimmer').fadeOut(800);
    $('#product-lb').hide(800);
});

$('.x').click(function() {
            $('#dimmer').click();
        });

なぜそれが起こっているのか分かりません！クロムではすべてがうまくいきますが、インターネットエクスプローラーになると、すべてが面倒です.

前もって感謝します！