CodesJava

Easy learning with example program codes

jQuery bind()


The jQuery bind() event attaches one or more event handlers of the selected elements and executes a specified function when the event occurs.

Syntax:

$(selector).bind(event,data,function,map)

Event: It is a compulsory parameter as it specifies the events to attach.

Data: It is an optional parameter which is used to specify any additional data.

Function: It is also a compulsory parameter as it specify the function to execute when the event occurs.

Map: It is also an optional parameter which is used to specify an event map.

Features of jQuery bind() events:

  • Compatible on various browsers.
  • Easy and quick.
  • Provides shorthand and easy methods for binding event handlers.

 

Example 1

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){  
	$("button").bind("click", function(){  
    	alert("Width: " + $("div").width());  
	});  
});  
</script>  
</head>  
<body>  
<div style="height:100px;width:500px;padding:10px;margin:3px;border:1px solid blue;background-color:lightpink;"></div><br>  
<button>Width</button>  
</body>  
</html>

Try it

JS Bin on jsbin.com

Example 2

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){  
	$("h1,h2").bind("click", function(){  
    	$(this).hide();  
	});  
});  
</script>  
</head>  
<body>  
<h1>Click me. I am a ghost.</h1>  
<h2>Me too.</h2>  
</body>  
</html>

Try it

JS Bin on jsbin.com

Sign Up/ Sign In
Ask a Question


Industrial Training

We offers Placement Oriented Training on Java, Spring, JSF, Hibernate, PHP, AngularJS, Angular 4, PLSQL, Oracle BI Publisher etc. We also provides Online training, please mail us at hr@codesjava.com.

Development

We also provides the Development services for Website Development , Java Development, PHP Development, Android App Development etc. You can contact us on hr@codesjava.com.

Copyright © 2018 CodesJava DMCA.com Protection Status SiteMap Reference: Java Wiki