Featured
-
How Regression Testing Detects Integral Errors In Business Processes
Humans are forever changing and evolving and so to
by kristina.rigina -
Get Display Banner Advertising Opportunity on FindNerd Platform
“Do you have a product or service that nee
by manoj.rawat -
Android O Released with Top 7 New Features for App Developers
Android was founded by Andy Rubin, Rich Miner, Nic
by sudhanshu.tripathi -
Top 5 Features That Make Laravel the Best PHP Framework for Development
Laravel is a free open source Web Framework of PHP
by abhishek.tiwari.458 -
Objective C or Swift - Which Technology to Learn for iOS Development?
Swift programming language is completely based on
by siddharth.sindhi
Tags
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
...
How to make AJAX call in jQuery?
Sometimes we need to make AJAX call in our Web page. The purpose of AJAX call is that you want to get/submit data without refreshing your page or you want to submit your form by calling an API. We can do this very easily by using ajax() method of...
How to push values in array in jQuery?
Sometimes we need to insert valuse in an array, we can do this by using push() method of jQuery very easily.
Example
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-...
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(){
$('...
jQuery DOM manipulation methods
The following table provides list of all the methods that are used to manipulate the HTML and CSS.
Except html() method all other methods below work for both HTML and XML documents.
Method
Description&nbs...
jQuery Selectors
Selectors, as the name suggests, are used to select one or more HTML elements using jQuery. Once an element is selected we can perform various operations on that selected element. jQuery selectors are used to access HTML elements through their id...
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)...
Bootstrap Tooltip Plugin
The Tooltip plugin is used to show the details of an element when the user will hover on that element. It will show a small pop-up in the specified position to the element.
You have to use data-toggle="tooltip" attribute and a title in the ele...
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 disappear a div with explode effect using Jquery
Hello Reader if you want to hide or disappear a div then you can do it by exlpode effect. This will driven by Jquery.
First create a blank html file name is exlodeeffect.html and its code will go like this:-
<html lang="en">
&...
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>
...
How to validate a form on submit?
Whenever we create a form, we always have a requirement to put validation for empty fields on some input fields on form submit. For this we use onSubmit attribute of the form, inside which we can define a function that will have validations.
E...
How to check if an array contains a specific string in jQuery?
Sometimes we need to check if a particular string exists in an array or not, we can do this by using inArray() method of jQuery very easily.
Example
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"&g...
How to run php code when click action occur on link
Hello Reader's, If you want to run PHP code when user click any selected anchor tag then you can use the Jquery for this. Lets see how you can run this code.
First you have to write the onlclick action on the anchor tag like this:-
<a hr...
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....
JQuery - eq( index ) Method
JQuery have DOM filter methods which we can use to filter out elements from a list of DOM elements.
It provides DOM traversal methods to help us select elements in a document randomly as well as in sequential method.
DOM Traversal Methods...
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...
Jquery ajax post example with PHP
Hello Readers ,
If you want to post the form but do not want to refresh the browser then the best approach to follow by using AJAX call .
Following is the HTML and Jquery code.
HTML:
<form id="foo">
<label for="bar">A...
jQuery clone() Method
The clone() method is used to make clone of the elements that are matching to the selected elements and select the clones.
It basically makes copies of the selected DOM element to some other place in the DOM.
Syntax:
selector.clone()
...
How to integrate time zone in jquery calender
Hello Reader's If you are making the html 5 form then you can integrate the user time zone in the date time calender also, Lets see the example below:-
first you have to downoad the JS an CSS file from here
Now you have to create an html pa...
DOM Element Replacement in jquery
If you want to replace html element with some other element, the jquery replaceWith method can be used.
You can replace some specified DOM element with the other html or DOM element. The replaceWith() method is used in this case.
Syntax:
...
Slidebar Menu plugin in Jquery
We can create a slidebar menu using jquery slidebar plugin. It is a jQuery plugin that gives a slidebar menu for easily implementing in the web pages.
We have to include slidebars.js in our source files.
Here is an example that shows how to...
Accordion Menu using jQuery
Accordion Menu are like the dropdown menu with some effects of animation. It has some top menu and dropdown list inside that menu and some other top menu and another dropdown list inside this menu.
When we click on the first top menu the dropd...
jQuery :not() selector
JQuerys :not() selector is used to filter in some cases when we have some selectors. It selects all the elements except the elements that matches the selector.
for example, If we have some checkboxes. When we select any checkbox the backgroun...
How does caching helps and how to use caching in jQuery?
Hello Readers,
In jquery when we use the two or more than two same id's as a selector or elements and operate over jquery event than sometimes effect on its performance due to caching.
For Example :
$("#mydemo").css("color", "red");
//...
