zoukankan      html  css  js  c++  java
  • Element.Event

    addEvent(type,fn):为DOM元素增加一个事件监听器

    removeEvent(type,fn):移除先前为DOM元素添加的事件监听器 

    eg:

    var destroy = function(){ alert('Boom: ' + this.id); } // this refers to the Element.
    $('myElement').addEvent('click', destroy);
     
    //later...
    $('myElement').removeEvent('click', destroy);

    addEvents(events):一次为一个DOM元素添加多个事件监听器

    eg:

    $('myElement').addEvents({
        mouseover: function(){
            alert('mouseover');
        },
        click: function(){
            alert('click');
        }
    });

    removeEvents(events):移除DOM元素上某个类型的事件的所有监听器

    var myElement = $('myElement');
    myElement.addEvents({
        mouseover: function(){
            alert('mouseover');
        },
        click: function(){
            alert('click');
        }
    });
     
    myElement.addEvent('click', function(){ alert('clicked again'); });
    myElement.addEvent('click', function(){ alert('clicked and again :('); });
    //addEvent will keep appending each function.
    //Unfortunately for the visitor, there will be three alerts they'll have to click on.
    myElement.removeEvents('click'); // saves the visitor's finger by removing every click event.


    fireEvent(type[,param,delay]):执行一个DOM元素上某个类型的事件的所有监听器,多用于需要在特定的时间或者场合下触发事件时

    eg1:

    function test(a) {
      console.log(a);
    }
    $("btn1").addEvent('click', test);
    $("btn1").addEvent('click', function() {
      console.log('btn1 click event run')
    });
    
    $("btn1").fireEvent("click", "hello,world");

    这个例子中代码将在页面一加载完就执行,而不需要等到click btn1时才执行。下面这个例子将更好的说明fireEvent的使用场合:

    textarea.addEvents({
        focus: function() {
          // When focusing, if the textarea contains value "Type here", we
          // simply clear it.
          if (textarea.value.contains('Type here')) textarea.set('value', '');
        },
    
        keyup: function() {
          // When user keyups we check if there are any of the magic words.
          // If yes, we fire our custom event burn with a different text for each one.
          if   (textarea.value.contains('hello')) textarea.fireEvent('burn', 'hello world!');
          else if (textarea.value.contains('moo')) textarea.fireEvent('burn', 'mootools!');
          else if (textarea.value.contains('pizza')) textarea.fireEvent('burn', 'Italy!');
          else if (textarea.value.contains('burn')) textarea.fireEvent('burn', 'fireEvent');
          // note that in case of 'delayed', we are firing the event 1 second late.
          else if (textarea.value.contains('delayed')) textarea.fireEvent('burn', "I'm a bit late!", 1000);
        },
        burn: function(text) {
          // When the textarea contains one of the magic words
          // we reset textarea value and set the log with text
          textarea.set('value', '');
          log.set('html', text);
          // then we start the highlight morphing
          highlight.start({
            backgroundColor: ['#fff36f', '#fff'],
            opacity: [1, 0]
          });
        }
      });
    

    注意标红部分。

    结合这两个例子,想必fireEvent的用法已经很清楚了。

    cloneEvent(from[,type])从一个DOM元素上复制所有监听器到本元素:

    eg:

    function test(a) {
      console.log(a);
    }
    $("btn1").addEvent('click', test);
    $("btn1").addEvent('click', function() {
      console.log('btn1 click event run')
    });
    $("btn1").fireEvent("click", 123);
    $("btn2").cloneEvents($("btn1"));

    将btn1上绑定的事件复制给btn2





  • 相关阅读:
    bzoj 3209: 花神的数论题 数位dp
    bzoj 1799: [Ahoi2009]self 同类分布 数位dp
    Codeforces 755 F. PolandBall and Gifts 多重背包+贪心
    Educational Codeforces Round 17 D. Maximum path DP
    Codeforces Round #396 (Div. 2) C. Mahmoud and a Message DP
    Codeforces 768 E. Game of Stones 博弈DP
    HDU 2457/POJ 3691 DNA repair AC自动机+DP
    Codefoces 791D. Bear and Tree Jumps 树形DP
    Codeforces 440 D. Berland Federalization 树形DP,记录DP
    Codeforces 709E. Centroids 树形DP
  • 原文地址:https://www.cnblogs.com/riskyer/p/3315465.html
Copyright © 2011-2022 走看看