Skip to content
Related Articles
Get the best out of our app
GeeksforGeeks App
Open App
geeksforgeeks
Browser
Continue

Related Articles

SVG Event.cancelable Property

Improve Article
Save Article
Like Article
Improve Article
Save Article
Like Article

The SVG Event.cancelable property indicates whether the event can be canceled.

Syntax:

bool = event.cancelable

Return value: This property returns the boolean value of the event element.

Example 1: In the following example, we will be using onclick event.

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 1000 1000" 
        xmlns="http://www.w3.org/2000/svg">
          
        <circle cx="50" cy="50" r="50" 
            onclick="check(event)" />
  
        <script type="text/javascript">
            function check(event) {
                document.write(
                    "This Event is cancelable : ",
                    event.cancelable);
            }
        </script>
    </svg>
</body>
  
</html>

Output:

Example 2: In the following example, we are using onclick event.

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 1000 1000" 
        xmlns="http://www.w3.org/2000/svg">
          
        <text x="50" y="20" font-size="20px" 
            onclick="check(event)">
            GeeksForGeeks
        </text>
  
        <script type="text/javascript">
            function check(event) {
                document.write(
                    "This Event is cancelable : ",
                    event.cancelable);
            }
        </script>
    </svg>
</body>
  
</html>

Output:

Example 3: In the following example, we are using onmouseover event.

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 1000 1000"
        xmlns="http://www.w3.org/2000/svg">
          
        <circle cx="50" cy="50" r="50" 
            onmouseover="check(event)" />
          
        <script type="text/javascript">
            function check(event) {
                document.write(
                    "This Event is cancelable : ", 
                    event.cancelable);
            }
        </script>
    </svg>
</body>
  
</html>

Output:

Example 4: In this example, we will use onmouseover event.

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 1000 1000" 
        xmlns="http://www.w3.org/2000/svg">
          
        <text x="50" y="20" font-size="20px"
            onmouseover="check(event)">
            GeeksForGeeks
        </text>
  
        <script type="text/javascript">
            function check(event) {
                document.write(
                    "This Event is cancelable : ",
                    event.cancelable);
            }
        </script>
    </svg>
</body>
  
</html>

Output:


My Personal Notes arrow_drop_up
Last Updated : 30 Mar, 2022
Like Article
Save Article
Similar Reads
Related Tutorials