jQuery was originally released in January 2006 at BarCamp NYC by John Resig and was influenced by Dean Edwards' earlier cssQuery library.
Showing posts with label jquery. Show all posts
Showing posts with label jquery. Show all posts
Tuesday, 19 April 2016
Monday, 11 April 2016
Jquery bind() && unbind() methods
<html>
<head>
<title>bind() event example</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#b1").click(function(){
$(".one").text("This is Div Content");
$(".one").bind("mouseover",function(){
alert("sdhfj");
});
});
$("#b2").click(function(){
$(".one").unbind("mouseover");
$(".one").text("jquery remove now");
});
});
</script>
<style>
.one
{
width:200px;
height:100px;
background-color:red;
color:#fff;
}
</style>
</head>
<body>
<input type="button" id="b1" value="Start"/>
<input type="button" id="b2" value="Stop"/>
<div class="one">
</div>
</body>
</html>
<head>
<title>bind() event example</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#b1").click(function(){
$(".one").text("This is Div Content");
$(".one").bind("mouseover",function(){
alert("sdhfj");
});
});
$("#b2").click(function(){
$(".one").unbind("mouseover");
$(".one").text("jquery remove now");
});
});
</script>
<style>
.one
{
width:200px;
height:100px;
background-color:red;
color:#fff;
}
</style>
</head>
<body>
<input type="button" id="b1" value="Start"/>
<input type="button" id="b2" value="Stop"/>
<div class="one">
</div>
</body>
</html>
live() event in jquery
<html>
<head>
<title>live() event example</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("p").live("click",function(){
$(this).after("<p>This is Add Paragraph.</p>")
});
});
</script>
</head>
<body>
<p>This is a Paragraph.</p>
</body>
</html>
Note: If we use $('p').click(function) then the new p can't create new p so for this purpose jquery introduce another concept live().
<head>
<title>live() event example</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("p").live("click",function(){
$(this).after("<p>This is Add Paragraph.</p>")
});
});
</script>
</head>
<body>
<p>This is a Paragraph.</p>
</body>
</html>
Note: If we use $('p').click(function) then the new p can't create new p so for this purpose jquery introduce another concept live().
Friday, 8 April 2016
What is $() in jQuery library?
What is $() in jQuery library?
The $() function is an alias of jQuery() function, at first it looks weird and makes jQuery code cryptic, but once you get used to it, you will love it's brevity. $() function is used to wrap any object into jQuery object, which then allows you to call various method defined jQuery object. You can even pass a selector string to $() function, and it will return jQuery object containing an array of all matched DOM elements. I have seen this jQuery asked several times, despite it's quite basic, it is used to differentiate between developer who knows jQuery or not.
The $() function is an alias of jQuery() function, at first it looks weird and makes jQuery code cryptic, but once you get used to it, you will love it's brevity. $() function is used to wrap any object into jQuery object, which then allows you to call various method defined jQuery object. You can even pass a selector string to $() function, and it will return jQuery object containing an array of all matched DOM elements. I have seen this jQuery asked several times, despite it's quite basic, it is used to differentiate between developer who knows jQuery or not.