将事件侦听器添加到窗口的子对象

时间:2016-08-31 16:26:03

标签: javascript typescript

是否可以向窗口上的子对象添加一个事件,一个可以从任何地方接受事件的事件(如窗口)?

所以,例如:

window.myVariable.addEventListener('keydown', doKeyDown);

这样我就可以删除这个特定的按键事件,而不会删除附加到窗口的其他keydown事件。

这样的事情是怎么做到的?

2 个答案:

答案 0 :(得分:1)

You could create a simple registry that operates on a "namespace".

(function() {

  var register = {};

  function addNamedListener(namespace, eventType, callback) {
    register[namespace] = register[namespace] || [];
    register[namespace].push({
      eventType: eventType,
      callback: callback
    });

    window.addEventListener(eventType, callback);
  }

  function removeNamedListener(namespace) {
    register[namespace].forEach(function(event) {
      window.removeEventListener(event.eventType, event.callback);
    });
  }

  window.WindowEvents = {
    addNamedListener: addNamedListener,
    removeNamedListener: removeNamedListener
  }

})();

// Attach a general window event to the actual window
window.addEventListener('click', function(e) {
  console.log(e.target);
});

// Attach a namedspaced event
WindowEvents.addNamedListener('windowClicks', 'click', function(e) {
  console.log(e.target);
});

// Attach another event to the same namespace
WindowEvents.addNamedListener('windowClicks', 'click', function(e) {
  console.log(e.clientX);
});

// Attach a new event to a different namespace
WindowEvents.addNamedListener('down', 'mousedown', function(e) {
  console.log('Mouse down occurred');
});
<div>Click Me</div>

Then, when you are ready to get rid of the events in that "namespace", you would just do this:

WindowEvents.removeNamedListener('windowClicks');

This will leave the original window events, as well as the other namespace event that was created (down).

This should at least get you started.

答案 1 :(得分:0)

不是,尽管你可以将处理程序分配给例如body元素。

  

这样我就可以删除这个特定的按键事件,而不会删除附加到窗口的其他keydown事件。

这听起来像是X-Y问题。

removeEventListener要求您指定要删除的事件侦听器。

<?php
session_start();

  function post_to_sms($url,$post_string)
  {
    // post form to SMS API

    $curl_result=$curl_err='';
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL,$url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
    curl_setopt($ch, CURLOPT_POST, 1);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $post_string);

    // note - set HOST where your API resides
    curl_setopt($ch, CURLOPT_HTTPHEADER, array("POST /cgi-bin/webscr HTTP/1.1",
            "Content-Type: application/x-www-form-urlencoded", 
            "Content-Length: " . strlen($post_string),
            "Host: yourdomain.com",
            "Connection: close"));

    curl_setopt($ch, CURLOPT_HEADER , 0);   
    curl_setopt($ch, CURLINFO_HEADER_OUT , 1);   
    curl_setopt($ch, CURLOPT_VERBOSE, 1);
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
    curl_setopt($ch, CURLOPT_TIMEOUT, 30);

    $curl_result = @curl_exec($ch);

    // 2 lines of debug (comment for production)
//   print_r(curl_getinfo($ch));
//    echo "<br /> error = " . $curl_err = curl_error($ch);

    curl_close($ch);

    return $curl_result;
  } // end of CURL function

  // URL for your SMS API
  $url = "yourdomain.com/sms/sms_controlling.php";

  if( isset($_REQUEST['telNumber']) )
  {
    if( is_numeric( $_REQUEST['telNumber'] ) && ( $_REQUEST['telNumber'] > '1000000000' ) &&  ( $_REQUEST['telNumber'] < '9999999999' ) )
    {

        // create array of form variables
        // 'From' is input - 'To' and 'Body' is hard-coded 

        $post_data['From'] = $_REQUEST['telNumber'];
        $post_data['To'] = "%2b17204447777";  //Enter Twilio Phone number
        $post_data['Body'] = "keyword Here";  //Enter The Keyword to your SMS Campaign.

        foreach ( $post_data as $key => $value) 
        {
          $post_items[] = $key . '=' . $value;
        }
        $post_string = implode ('&', $post_items);

        post_to_sms( $url, $post_string );

    } else {
      $_SESSION['errmessage'] = "Sorry.  All 10 Digits of Phone Number (incl Area Code) are required.";
    }
  }

  ?>

...所以默认行为是“不删除其他keydown事件”。