• wordpress CMS主题:ssmay主题wordpress CMS主题:ssmay主题
  • 首页 > JS应用 > JQuery学习记录(五):模拟事件方法trigger()和triggerHandler()

    JQuery学习记录(五):模拟事件方法trigger()和triggerHandler()

    作者: 分类:JS应用 点击: 32 次
    wordpress CMS主题:ssmay主题

      有时候,我们可能有这样的需求,希望在自己的网页加载完成后,模拟用户点击一下页面上的某一个特定的按钮触发事件,以提示浏览用户。而这个点击事件并不是用户所操作的,是jquery模拟用户点击操作的,这就是jquery的事件模拟操作。在某些情况下,这个事件模拟操作还是非常受用的。事件模拟操作不只针对点击事件,对其它事件也同样,如:focus焦点激活事件、resize改变大小事件等。下面以模拟点击事件为例,对事件模拟操作进行介绍。

      直接点击:

      $('.show').click(function () {
      alert('这是用户直接点击事件!');
      });

      模拟用户点击行为

      $('.show').click(function () { //
      alert('这是模拟点击事件!');
      });
      $('.show').trigger('click'); //为.show元素指定click点击事件类型

      合并两个方法

      $('.show').click(function () {
      alert('这是模拟点击事件!');
      }).trigger('click');

      trigger()语法:

      $(selector).trigger(event,[param1,param2,...])

      参数说明:

      event:必需。规定指定元素要触发的事件。可以使用任何标准事件或自定义事件(使用 bind()或on() 函数来附加)。
      param1,param2:可选。给事件处理程序传递额外参数,这对自定义事件特别有用。1个参数时,直接传递即可。2个以上,需用中括号包含
      起来。但不能认为是数组形式,下面给出一个复杂的说明。

      下面这个安全是以“对象和数组”作为传递参数:

      $('.show').click(function (e, data1, data2) {
      alert(data1.a + ',' + data2[1]);
      }).trigger('click', [{'a' : '1', 'b' : '2'}, ['123','456']]);

      上面代码中,data1={'a' : '1', 'b' : '2'}对象 ,而data2=['123','456']数组。

      .triggerHandler():这个方法的使用和.trigger()方法一样。

      它们的区别:

      1、triggerHandler()只会影响第一个匹配到的元素,而.trigger()会影响所有。
      2、triggerHandler()不会触发事件的默认行为,而.trigger()会。
      3、trigger()在创建事件的时候,会冒泡。而triggerHandler()不会冒泡。
      4、triggerHandler()会返回当前事件执行的返回值,如果没有返回值,则返回undefined;而trigger()则返回当前包含事件触发元素的jQuery 对象(方便链式连缀调用)。

    文章作者:ssmay
    本文地址:http://wanlimm.com/77201808026411.html
    本文时间:2018-08-02 08:41:21
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    上一篇:
    下一篇:
    wordpress CMS主题:ssmay主题

    或许你会感兴趣的文章:

    发表评论

    电子邮件地址不会被公开。 必填项已用*标注

    This site uses Akismet to reduce spam. Learn how your comment data is processed.