JAVASCRIPT

event listener javascript

const element = document.querySelector(".class__name");

element.addEventListener("click", () => {
	console.log("clicked element");
});

event listener javascript

document.querySelector('div').addEventListener('click', () => {
  console.log('div clicked');
});

event listener

// src/EventListener/ExceptionListener.php
namespace AppEventListener;

use SymfonyComponentHttpFoundationResponse;
use SymfonyComponentHttpKernelEventExceptionEvent;
use SymfonyComponentHttpKernelExceptionHttpExceptionInterface;

class ExceptionListener
{
    public function onKernelException(ExceptionEvent $event)
    {
        // You get the exception object from the received event
        $exception = $event->getThrowable();
        $message = sprintf(
            'My Error says: %s with code: %s',
            $exception->getMessage(),
            $exception->getCode()
        );

        // Customize your response object to display the exception details
        $response = new Response();
        $response->setContent($message);

        // HttpExceptionInterface is a special type of exception that
        // holds status code and header details
        if ($exception instanceof HttpExceptionInterface) {
            $response->setStatusCode($exception->getStatusCode());
            $response->headers->replace($exception->getHeaders());
        } else {
            $response->setStatusCode(Response::HTTP_INTERNAL_SERVER_ERROR);
        }

        // sends the modified response object to the event
        $event->setResponse($response);
    }
}

Add Event Listeners

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      message: ""
    };
    this.handleEnter = this.handleEnter.bind(this);
    this.handleKeyPress = this.handleKeyPress.bind(this);
  }
  // change code below this line
  componentDidMount() {
    document.addEventListener("keydown", this.handleKeyPress);
  }
  componentWillUnmount() {
    document.removeEventListener("keydown", this.handleKeyPress);
  }
  // change code above this line
  handleEnter() {
    this.setState({
      message: this.state.message + "You pressed the enter key! "
    });
  }
  handleKeyPress(event) {
    if (event.keyCode === 13) {
      this.handleEnter();
    }
  }
  render() {
    return (
      <div>
        <h1>{this.state.message}</h1>
      </div>
    );
  }
}

event listeners

function simulateClick() {
// Get the element to send a click event
const cb = document.getElementById("checkbox");

// Create a synthetic click MouseEvent
  let evt = new MouseEvent("click", {
    bubbles: true,
    cancelable: true,
    view: window
  });

// Send the event to the checkbox element
cb.dispatchEvent(evt);
}
document.getElementById("button").addEventListener('click', simulateClick);