JavaScript event prevent default

-

JavaScript event preventdefault is a method for intervening event actions preventing normal events behavior

Take for instance you have an anchor on a page when a user clicks on it the browser by default navigates to a url in it's href attribute

preventdefault syntax

/// HTML
<a href="/" id="home">
    home
</a>

/// JavaScript
home.addEventListener('click', function(event){
    event.preventdefault()
    // rest of
    // the code
})

Comments

Post a Comment

Popular posts from this blog

How to resume a suspended web audio api context

-
A quick JavaScript function to maneuver around Google chrome, Firefox and safari web audio context suspension state Starting from chrome v{xx} Google chrome, Mozilla Firefox and Apple safari web browsers automatically suspend html5 web audio contexts if they start without any user gesture they can only be resumed by a user gesture it's a measure implemented to improve overall user experience. context.state property stores the state of the audio context when it's suspended it's value changes to "suspended". in order to implant a maneuver first check the state of the context should it be suspended literate an array of events for each add an event listener on the document body and remove the event if one of the events has been triggered by the user let unlockAudio = function(context) {     if (context.state === 'suspended') {         let events = ['touchstart', 'touchend', 'mousedown', 'keydown']         let unlock = function(...
Read more

Introduction to Kotlin programing language

-
Kotlin is an open source statically typed programming language named after an island just like Java was named after an Indonesian island. Kotlin runs on the JVM and can compile to JavaScript. Uses for kotlin programming language Kotlin is a preferred programming language for Android application development second after Java programming language. Kotlin can be used for artificial intelligence and data science research applications. Because of its speed kotlin is a well suited programing language for web server application development. On rare occasions you can use kotlin to develop client side application simply because it can compile to JavaScript. Hello world application in kotlin programming language Kotlin applications must have a main method. println is used for text output just like in Java fun main() {     println("hello world") } After compiling the output should be "hello world" Basic s yntax variable declaration Variables are declared using ...
Read more

How to set content disposition headers for express nodejs apps

-
Image
In express nodejs apps you can force the user agent "browser" to rather download content instead of displaying or attempting to render given content within the browser. In this example assuming you're using express.static to serve content pass an Object as second argument to express.static function An Object with configuration parameters; const config = { setHeaders: res => res.set('Content-disposition',  'attachment') } In your code replace "path/to/media/" with the path pointing to the static content. app.use('/media/', express.static('path/to/media/', config)) To test try accessing content at /media/*
Read more

Ways of iterating Object properties in JavaScript

-
For Objects the ways of iterating their properties are not that plentiful as with Arrays. take for instance we have an object of dogs and cat characteristics const pets = { {name: " Jenny ", eyes: "brown"}, {name: "max", eyes: "blue"} } To iterate through the characteristics using for loop for (pet in pets) {     console.log(`${pets[pet].name} has eye color ${pets[pet].eyes}`} } Alternatively you can use objects.keys and object. entries for (element in Object.entries(elements)) }
Read more

JavaScript intro to classes

-
Classes are objects 'functions which introduce inheritance parent child relationship in JavaScript it promotes code reusability which reduces the amount of code in a JavaScript application. JavaScript class decelerations start with keyword class proceeded by class name with a class body having a constructor along with methods for instance class human {     constructor(name) {          this.name = name;          this.gender = null;     }     great() {         return "Greetings " +         (this.gender == "male") ? "mr " : "mrs " + this.name     } } Child classes are created by adding the keyword extends followed by the parent class name and parent class methods can be called using the syntax super.+"method name"(parameters) class man extends human {   ...
Read more