Featured
-
Top 10 Template Engines for JavaScript
What is a Template engine? Template Engines are
by nishant.mishra -
jQuery Accordion
Hello readers! In this Blog we will gain knowled
by vishwanath.rana -
How to make Numbered and bulleted list in HTML Editor with JavaScript
Hello all, Working with HTML Editor we wanted t
by gaurav.gautam -
How to hide particular div with just one click?
Hi, you want a condition in which the particula
by abhishek.tiwari.458 -
How to Create and Retrieve Array in Javascript?
If you want to store multiple values in a single v
by siddharth.shahi
Tags
How to use bind() Method in Jquery ?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to use bind() Method in Jquery.
The bind()methods is one of the most important aspects of dealing with events through jQuery.
Basically,the bind() method affixes ...
How to use append()event in Jquery ?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to use append()event in Jquery.
Basically append() method is used for inserting specified content at the end of the selected elements hence we can say that this ...
create element with dynamic id on click event with jquery
If you want to create multiple elements with dynamic id on click of button or an HTML element see below program for reference.
/* The following html/jquery snippet will create multiple input boxes with dynamic id on clicking an individual elem...
Different ways to dynamically add list items at the end of the list using jquery
Whenever we use lists (either Unordered-ul or ordered-<ol>) in html, in most of the cases there comes a need to add dynamic elements at the end of the list. This is achieved using javascript or jquery. Jquery being a fast and commonly...
Adding css property using jQuery
Hii All ,
Jquery is a type scripting langauge created by John Resig along with his team in 2006.
It is a client side script programming language.
It is a concise javascript library.
Both javascript and jquery is used for script progra...
jQuery Callback Functions
JavaScript codes are executed line by line. However, the next line of the code can run even though the effect of the first line of code is not finished. This can create errors.
To prevent this errors, we can create a callback function. callbac...
Stylish tool tip display on hover of an element with the help of jquery
How to use stylish tool tip on hover of an element with jquery
To use the jquery basic tool tip you have to first include the following basic jquery file with another two. One will be use for jquery tool tip effect and other for tool tip css...
Change the form action before submit
How to change the form action before submit on the basis of element/input field click.
The html sample code for form having radio button and submit button :
<form action="" id="myformID">
<input type="radio" name="ch...
Making a draggable element using jQuery UI
Earlier using javascript code to make an element draggable was very hard and moreover cross-browser version working of code was very difficult.
The following code shows how to make an element draggable inside its parent element by using ...
Display Child Content by clicking parent Element in multiple listing
Hello Friends,
Today I have created a simple example of child element show and hide function in jQuery. Many times I found that we are facing an issue of showing child element of each list by clicking list parent element.
Here in jQuery code,...
Lets create jQuery plugin: part 1
jQuery have been widely used for interactive websites. There are plenty of plugins available built on jquery. We can also create our plugins. In this tutorial we will create a plugin and add few options.
We will create a jquery.myplugin....
How to make only digits validation for textbox using Jquery
Hello Reader's! if you are making the html form in which some textbox you only want as taking the digits only. Then in this blog you can learn how to make this digit type validation. Since now most of the website are providing the frontend ty...
How to disable select box if no option is set using Jquery
Hello Reader's if you have desing the html web form where you want to put the select box dissable if no option is selected.
So let's start with the html form and its code will go like this:-
<form name="sell" id="sell" method="...
Introduction to JCanvas
JCanvas: As we know that canvas is used to draw graphics with the help of javascript. In this there are certain properties to draw a line, circle, box, etc but canvas does not support event handlers.
JCanvas is a javascript library which is...
How to show show the text data from a file into website using ajax
Hello Reader's if you are making the website in which you have to fetch and show the content data from an external file then in this blog you can see how to do it. In web technologies different technologies offers you many ways to do this but...
How to set fomr action on two submit buttons using Jquery
Hello Readers, if you are developing the html form with two or more submit buttons then in this blog you can learn it. On certains conditions a html form should have multiple submit buttons and both should redirect user to their individual ...
Google Maps: How to disable mouse scroll wheel with Google Maps API ?
Diable Google Maps scrolling:
I was facing issue with Google Maps API version 3. On page scroll, google maps scroll should be disabled i.e. I have to disable zooming when you scroll on the map. So this is how I have fixed this issue. Write thi...
jQuery AJAX load()
It is a very simple and powerful ajax method to load the data from the server and display it in the selected element.
$(selector).load(URL,data,callback);
URL parameter specifies the URL you wish to load
data parameter specifies a set ...
CSS jQuery
We can add css by jquery using css() method
To return the value of a specified css property
css("propertyname");
To set a css property
css({"propertyname":"value","propertyname":"value",...});
To set a background and the fontsi...
$.each loop
$.each loop is the substitute of the age old for loop and for-in loop.
jquery provide an object iterator utitlity $.each() and collection iterator utitlity .each().
$.each is an generic iterator function for loop. It is used for both object...
How does page redirection works in javascript?
Sometimes you want to notify your visitors of the change of the new domain name when your webpage is moved. At that time it is good way to place a “redirect page” at the old location which, after a timed delay, will forward visitors t...
Jquery HTML
We can add html dynamically to our website using jQuery.
We use to add html dynamically like when we want on some click function or we want to some other event to add boxes and any other thing.
We can use function to add
function appen...
jQuery adding class
We can dynamically add class to the html using the jQuery.
It is used when we are adding html dynamically or when at an event we want that css to be called.
We can add the css class simply
$("button").click(function(){
$("h1...
Different types of jQuery Remove Elements
With the help of jQuery, its easy to remove any html within a single click. jQuery is having 2 methods to remove html elements.
remove() - Removes the selected element (and its child elements)
empty() - Removes the child elements
...
Introducing addClass method and toggle function in jquery
addClass() method adds one or many methods or class to the paragraph or the element you are using,This method will not remove the class but it adds another class by using different attributes. Users and also add toggle function to it. It will add...
Parent() and Parents() method in jquery
Many times I stuck in an issue of getting parent elements or specific elements to build a specific functionality over it. So that I went through the jquery library, where I found 2 relevant methods to get the specific elements or parent elements....
How to check if function exists or not in Javascript and jQuery
There might be some cases when we need to call a function without checking if function's definition is loaded or not. If loaded then that will be fine but if not loaded then it will throw an error as undefined function. We can handle this in ...
Difference between $('div/') and $('div') in jQuery?
Example of $('div/') in jQuery:
$('<div/>').addClass('test');
Example of $('div') in jQuery:
$('div').addClass('test');
Explanation of difference between $('div') and $('<div/&...
Difference between $(this) and 'this' in jQuery?
Example of $(this) in jQuery:
$(document).ready(function(){
$('#div1').mouseover(function(){
alert($(this).text());
});
});
Example of this in jQuery:
$(document).ready(function(){
$('...
How to change data on changing the option box
Hello Reader's if you are looing to develop the html form which changes the data on changing the values in option box, then in this blog you can see how it is done.
To making this form we will start from html file. And its code will go like this...
What are the advantages of using AngularJS over jQuery?
As the various answers here say, Angular is a framework and JQuery is a library
Let say we need to execute the well known scenario of a UI having the capacity to send a few solicitations to a backend server and shows the outcomes on a website...
How to validate coma seperated emails using Javascript
Hello Reader's, If you are developing the form for multiple email address as input, then you need to validate each email individually. You can do it by validating on submit or after submit.
By using the Jquery script you can do it on user end,...
jQuery - Removing hover effect in Responsive design
Hii,
As we all know that for mobile and tablet screen hover effect doesn't works so we need to remove all hover effects provided after window screen width 768px.It's very simple using Jquery.Just go through the following steps.
Step 1:Make su...
How to use jQuery clone () Method ?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to use jQuery clone () Method ?
The clone () Method is used for making a copy of matched element.This Method makes the
duplicate of the matched elements.
clone () Metho...
How to make validation for multiple email validation using Jquery
Hello Reader's if you have implemented multiple input for emails and you want to validate all of them using a single validation rule. By using JQuery you can make this.
Lets see how to make validation:-
Suppose your html page is like this:-
...
How to merge the contents of two or more objects together into the first object using jQuery
Hello friends,
Most of time we need to create Object of contents in jQuery and use it according to requirement , So in this block you will see how to merge two or more object in first object .
When two or more object arguments are supplied t...
Jquery:filter(selector) method
Jquery filter( selector) method:-
It is one of the most important method which we can use to filter out elements from a list of DOM elements.
It removes all elements from the set of matched elements that do not match the specified selector(s)...
How to make price range UI using Jquery
Hello Reader if you wan to make range selector UI using jquery this blog will be helpfull to you.
Lets start making this UI. First you have to create html file and it's code will go like this:-
<!doctype html>
<html lang="en"> ...
How run blinking effect of div in Jquery
Hello Reader if you are making the content based website where you want to show div in bounce or blink effect. Here this code is driven by Jquery.
First create html file with name bounce.html and its code will go like this:-
<!DOCTYPE h...
How to make div scalable using Jquery
Hello Readers if you are designing the html UI and you want to make div resizable by mouse then you can use the code as below:-
<!doctype html>
<html lang="en">
<head>
<link href="http://code.jquery.com...
How to increase font size of website by just single click
Hello Readers if you want to make a switch button that will increase your font size of webpage then you can learn to code it here.
first you have to create html page name it click.html, It's code will go like this:-
<!doctype html>
...
Jquery ajax json response
There is a need to set dataType in the ajax if you expect to get json response .
$.ajax({
url: "/accept",
type: "POST",
data: myformData,
context: this,
error: function () {},
dataType: 'json',
success : fun...
jQuery - Selectors
jQuery Selectors are used to find out matching elements and select one or more HTML elements using jQuery and then perform operations on them.
Factory function is a synonym of jQuery() function start with the dollar sign and parentheses $(...
Jquery draggable
Hello Readers ,
While building a web application , several times we need a box or a div which can be draggable so below is the code for explaining that .
Example :
<!DOCTYPE html>
<head>
<link href="http://code.jqu...
Jquery serialize function.
Hello Readers ,
jQuery serialize() method is used to create a text string in standard URL-encoded notation.
It is used in form controls like input, textarea, select etc.
It serializes the form values in such a way
so that its serialize...
How to use addClass() in jquery
The addclass() method is used to add one or more class name to the selected element.
This method is used only to add one or more class names to the class attributes not to remove the existing class attributes.
Syntax :
$(selector).addCla...
Jquery append()
The jQuery append() method is used to insert specified content at the end of the selected elements in the jQuery collection.
Syntax :
$(selector).append(content, function(index, html))
Example :
<!DOCTYPE html>
<html&g...
How to use jquery attr()
The jQuery attr() method is used to set or return attributes and values of the selected elements.
Syntax :
$(selector).attr(attribute)
Example:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax....
How to use Event binding on dynamically created elements in JQuery
Hello Guys
In JQuery, Events trigger a JQuery function to an event handler for the selected elements in the Html page.
Currently we are using jQuery 1.7, So you should use jQuery.function.on() as below :
$(staticAncestors).on(eventName,...
What is mouse enter event in Jquery
Hello Friends,
Here I am discussing about mouse enter event in jquery. Mouseenter can call a specific action when your mouse cursor enter in a specific html entity like button,specific div id, class etc.
In the below example we are hiding sp...
