Languages
[Edit]
EN

JavaScript - oncut event example

0 points
Created by:
Jan-Alfaro
341

In this article, we would like to show you oncut event example in JavaScript.

Quick solution:

var myElement = document.querySelector('#my-element');

myElement.addEventListener('cut', function() {
    console.log('oncut event occurred.');
});

or:

<input type="text" oncut="handleCut()">

or:

var myElement = document.querySelector('#my-element');

myElement.oncut= function() {
    console.log('oncut event occurred.');
};

 

Practical examples

There are three common ways how to use oncut event:

  • with event listener,
  • with element¬†attribute,
  • with element property.

In this example, we will execute handleCut() when the user cuts some text from the input (oncut event).

1. Event listener based example

In this section, we want to show how to use oncut event on input element via event listener mechanism.

// ONLINE-RUNNER:browser;

<!doctype html>
<html>
  <body>
    <input type="text" id="my-input" value="Cut this text.">
    <script>
      var myInput = document.querySelector('#my-input');

      myInput.addEventListener('cut', function() {
        console.log('oncut event occurred.');
      });
    </script>
  </body>
</html>

2. Attribute based example

In this section, we want to show how to use oncut event on input element via attribute.

// ONLINE-RUNNER:browser;

<!doctype html>
<html>
  <body>
    <input type="text" oncut="handleCut()" value="Cut this text.">
    <script>
      function handleCut(){
        console.log('oncut event occurred.');
      }
    </script>
  </body>
</html>

3. Property based example

In this section, we want to show how to use oncut event on input element via property.

// ONLINE-RUNNER:browser;

<!doctype html>
<html>
  <body>
    <input type="text" id="my-input" value="Cut this text.">
    <script>
      var myInput = document.querySelector('#my-input');

      myInput.oncut = function() {
        console.log('oncut event occurred.');
      };
    </script>
  </body>
</html>

JavaScript - events

Native Advertising
ūüöÄ
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

‚̧ԳŹūüíĽ ūüôā

Join