使用 .trigger('resize') 时将参数传递给 $(window).on('resize')

Question

我需要一种可靠的方法来检测 $(window).on('resize') 是否已被用户交互或 jQuery .trigger 调用触发。

我尝试了以下方法，但我似乎没有在函数调用中取回参数：

$(window).trigger('resize',[true]);

function prepareOnResize(e, triggered){ console.dir(triggered); }
$(window).on('resize',prepareOnResize);

触发的好像是return屏幕的宽度，所以我试了下面的，也没用：

$(window).trigger('resize',[true]);

function prepareOnResize(e, width, height, triggered){ console.dir(triggered); }
$(window).on('resize',prepareOnResize);

在那种情况下触发会返回 undefined。

我在这里不知所措 -- 任何帮助将不胜感激。

Answer 1

jQuery在事件对象中放了一个属性isTrigger，可以测试：

function prepareOnResize(e){ 
    if (e.isTrigger) {
        console.log('resize via jQuery trigger');
    } else {
        console.log('resize by user');
    } 
}

或者您可以使用 e.originalEvent，jQuery 只有本机事件对象具有，如前所述 here:

function prepareOnResize(e){ 
    if (!e.originalEvent)
        console.log('resize via jQuery trigger');
    } else {
        console.log('resize by user');
    } 
}

Answer 2

您可以尝试以下方法；

Javascript...dom 准备就绪...

var $window = $(window);

$window.on('resize', function(event, param1) {

  console.log("Window resized event triggered by...");

  if (typeof param1 === 'undefined') // could also do if(param1) to test for false
    console.log("System Event");
  else
    console.log("User Event");

   // Another way to check is to check the originalEvent property
   // if (e.originalEvent === undefined) alert ('triggered by code');
   // else alert ('triggered by system');

});

setTimeout(function() {
  $window.trigger("resize", ["Custom"]);
}, 2000);

这或多或少是您在代码中尝试的，它将区分两种类型的事件。

我还做了一个jsFiddle所以你可以看到： https://jsfiddle.net/sysdevcode/4w3b8e14/

使其适用于您的代码

$(window).trigger('resize',[true]);

function prepareOnResize(e, width, height, triggered){ console.dir(triggered); }
$(window).on('resize',prepareOnResize);

您需要更改 prepareOnResize() 函数中参数的顺序，因为 $(window).trigger('resize',[true]); 等同于 [true] 作为函数中的 "width" 参数发送。你需要做的，例如：

var $window = $(window);
$window.trigger('resize',[ $window.width(), $window.height(), true ]);

然后

function prepareOnResize(e, width, height, triggered){ ... }

可以，但是如果您不需要传递任何参数，那么上面代码的 e.isTrigger 可能更优雅一些。

使用 .trigger('resize') 时将参数传递给 $(window).on('resize')

Passing parameters to $(window).on('resize') when using .trigger('resize')

javascript

jquery

jquery-trigger

jquery-events