Skip to main content

Posts

Showing posts with the label auto refresh div in setTimeout jQuery

JQuery Mobile Introduction

JQuery Mobile is a touch-optimized web framework for creating mobile web apps and it is working on all popular smart-phones and tablets. Before you start learn jQuery mobile you should know following, ·          JQuery ·          CSS ·          HTML The uses of HTML, CSS and JavaScript solve these mobile related problems and it works for all standard mobile web browsers. Examples for Create a Basic Page Template in JQuery mobile as, <! DOCTYPE html > < html > < head > < meta name = "viewport" content = "width=device-width, initial-scale=1" > <!-- Include CSS URL --> < link rel = "stylesheet" href = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" > <!-- Include jQuery URL --> < script src = "https://code.jquery.com/jquery-1.11.3.min.js" ></ script > <!-- I...

document ready vs. window load

What is main difference between the $(document).ready () and window.onload()? The main differences are the $(document).ready() event called when your HTML document is loaded and DOM is ready and it's don't wait for your content and images etc. fully loaded but  window.onload() (<body onload="func();">) event is  wait for your content and images etc. fully loaded. The $(document).ready() function is called only one time when your page is loading not for partial page rendering in that case you need to use pageLoad() function. Document Ready function:- We can call more than one document.ready() function in single page. The  document.ready()  function is called when  DOM  is not fully loaded that means rest of images, css or other 3rd party reference on page. It will not wait for the images, css or other 3rd party to get loaded. Body Onload function:- The body.onload() function, we can have only one body.onload...

29 Best DOJO and JavaScript Tutorial and Examples for Beginners [DOJO]

Basic DOJO Concepts What is DOJO Toolkit? When should you use DOJO? Is jQuery better than DOJO? How much DOJO do I need to know in order to use the ArcGIS API for JavaScript? Where from Downloading DOJO? How to setup DOJO Application? What is folders Structure? What are DOJO components? Hello World Examples with live demo Basic Concepts - JavaScript What is Object in JavaScript? What is the Prototype object in JavaScript and how it is used? What is "this"? What is its value? Explain why "self" is needed instead of "this". What is a Closure and why are they so useful to us? Explain how to write class methods vs. instance methods. Can you explain the difference between == and ===? Ca...

jQuery bind() vs live() vs delegate() vs on() methods

I have seen a bit of confusion from JavaScript developers about the real differences on bind(), live(), delegate (), and on() methods and when they should be use or not use.                     I.             The . bind () method will not attach the events which elements are bind after the DOM fully loaded.                   II.             The . live () and delegate () methods attach the events which are dynamically added in future.                 III.             Only difference between . live () and delegate (), the . live () is not working for chaining element...

jQuery .click() vs .on() methods for adding a click event

The .click() events are only attach to fully loaded elements and can't use for dynamic added elements and utilize more memory and create event handler for each child. The .click () requires to event handler for all element which are attached and its produce the overhead at time of DOM manipulation. The  .on( )  events are used for both dynamic added elements and it’s consume less memory then .click () events. It allows creating the event handler which elements are added dynamically ways. The .on() will work for current and future elements and it a replacement of the bind() , live() and delegate() methods. The example as //For .click() event example: //HTML code < ul id = "click" > < li > List items < /li > < /ul > //For on() event example: //HTML code < ul id = "on" > < li > List items < /li > < /ul > //JavaScript code $ ( '#click li' ). click ( function () { $...

Auto Refresh div using setTimeout() jQuery

Hello Everyone, I am going to share the how to auto refresh a particular div using jQuery.  In jQuery, we are using setTimeout () function for auto refresh a div without reloading your page each and every 5 seconds.  Click for live demo The HTML code sample as given below. 1 2 3 4 5 6 7 8 //The HTML code sample   <div>      <input type= "button" id= "btnShow" value= "Click for Show div" />    </div>    <div class= "fonts" id= "divShow" >      <h2>Hi, Welcome you to code-sample.com.</h2> It will disappear in 5 seconds!    </div> //The HTML code sample <div> <input type="button" id="btnShow" value="Click for Show div" /> </div> <div class="fonts" id="divShow"> <h2>Hi, Welcome you to code-sample.com.</h2> It will disappear in 5 seconds! </...