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

时间:2016-04-21 18:26:07

标签: javascript jquery javascript-events jquery-trigger

S / O!

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

我尝试过以下操作,但我似乎没有在函数调用中获取参数:

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

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

触发似乎返回了屏幕的宽度,所以我尝试了以下,也无济于事:

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

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

在该实例中,触发回来undefined

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

2 个答案:

答案 0 :(得分: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可能会更加优雅。

答案 1 :(得分: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');
    } 
}