1

ブラウザのサイズを変更すると、複数のアラートが表示されます。「return false」を使用しても機能しませんでした。

unbind()/unbind('resize') を使用した場合は機能しますが、別の問題が発生します。resize() 関数は、2 回目のブラウザー/ウィンドウのサイズ変更から機能しなくなります。

私のコード-

<script src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {

    alert($(".myclass").parent().width());

    $(window).bind('resize',function() {
        alert($(".myclass").parent().width());
    });

});
</script>
<section class="myclass"></section>
4

4 に答える 4

0

ブラウザが変更されるたびにサイズ変更がトリガーされるためです。

100 ピクセルのサイズを変更する場合、最大 100 回トリガーできます。

このようなものは、ウィンドウのサイズ変更を停止した場合にのみ機能し、トリガーされます。

var resizing = false, stopedResizing = true;
$(window).bind('resize',function() {
    if(!resizing){
        console.log("started resizing. Width = " + $(".myclass").parent().width());
        resizing = true;
    }
    stopedResizing = false;
    setTimeout(function(){
       if(!stopedResizing){
           stopedResizing = true;
           setTimeout(function(){
               if(stopedResizing && resizing){
                resizing = false;
                console.log('Stoped resizing. Width = ' + $(".myclass").parent().width());
               }
           }, 500);
       }
    }, 500);
});
于 2013-03-22T13:53:42.250 に答える
0

これは jQuery の問題ではなく、ブラウザのサイズ変更の実装に関する問題です。

使用するブラウザによっては、途中でサイズ変更が発生する場合や、マウスを離したときにのみサイズ変更が発生する場合があります。

于 2013-03-22T13:54:30.667 に答える
-1

このコードは、サイズ変更イベントが発生した後、ウィンドウの上にマウスオーバーすると起動します。

$(document).ready(function() {

        var windowResized = false;

        function callFunction() {

            console.log("I am called once after window resize");
        }


        $(window).mouseover(function() {

            if (windowResized == true) {

                callFunction();
                windowResized = false;
            }

        })

        $(window).resize(function() {

            windowResized = true;

        });

    })
于 2013-03-22T14:01:43.103 に答える
-1

次のようなことができます。

$(document).ready(function(e) {

    alert($(".myclass").parent().width());
    var lastTime = 0;

    $(window).bind('resize',function() {
        var currentTime = new Date().time();
        if(currentTime > lastTime + 5000)
            alert($(".myclass").parent().width());
        lastTime = currentTime;
    });

});

...少なくとも 5 秒間隔のサイズ変更でのみ起動するようにします。ただし、通常は、サイズ変更の開始時ではなく、サイズ変更の停止時にアクションを実行する必要があります。

于 2013-03-22T13:58:10.807 に答える