- Trending Categories
- Data Structure
- Networking
- RDBMS
- Operating System
- Java
- MS Excel
- iOS
- HTML
- CSS
- Android
- Python
- C Programming
- C++
- C#
- MongoDB
- MySQL
- Javascript
- PHP
- Physics
- Chemistry
- Biology
- Mathematics
- English
- Economics
- Psychology
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Found 8895 Articles for Front End Technology
231 Views
To wrap two adjacent elements, loop through each myclass, add it to array and determining the next element has a .myclass. You can try to run the following code to learn how to wrap two adjacent elements in a containing div −ExampleLive Demo $(document).ready(function() { var result = []; $('.myclass').each(function() { var box2 = $(this).next().hasClass('myclass'); result.push($(this)); if(!box2) { var container = $(''); container.insertBefore(result[0]); for(x=0;x
124 Views
The best way to add DOM elements with jQuery is to append the HTML string, using append() method. You can try to run the following code to insert DOM element −ExampleLive Demo The jQuery Example $(document).ready(function() { $("div").click(function () { $(this).append('' ); }); }); .div { margin:10px; padding:12px; border:2px solid #666; width:60px; } Click on any square below to see the result:
316 Views
To select an element by name with jQuery, use the name element for the input field. You can try to run the following code to select element by name −ExampleLive Demo $(document).ready(function(){ $("#button1").click(function(){ var sname = jQuery("#form1 input[name=sub]").val(); alert(sname); }); }); Subject Name: Get
2K+ Views
To manipulate CSS pseudo elements using the hover() function. You can try to run the following code to learn how to manipulate CSS pseudo-elements −ExampleLive Demo $(document).ready(function(){ $('span').hover(function(){ $(this).addClass('change').attr('data-content','bar'); }); }); span.change:after { content: attr(data-content) ' This is demo text.'; } Place cursor below... foo
1K+ Views
To handle jQuery AJAX error. The ajaxError( callback ) method attaches a function to be executed whenever an AJAX request fails. This is an Ajax Event.Here is the description of all the parameters used by this method −callback − The function to execute. The XMLHttpRequest and settings used for that request are passed as arguments to this function. A third argument, an exception object, is passed if an exception occured while processing the request.The following is an example showing the usage of this method:Live Demo Handling errors in jQuery ... Read More
322 Views
Use the global error handler to receive a few of the parameters that jQuery can provide. After that add the suppressErrors: true. You can try to run the following code to disable some jQuery global Ajax event handlers for a request:Live Demo $(document).ready(function(){ $("div.log").ajaxError(function(evt, xhr, settings) { if(settings.suppressErrors) { return; } $(this).text( "ajaxError handler is triggered" ); }); $("button.trigger").click(function() { $("div.log").text(''); $.ajax("ajax/missing.html"); }); $("button.triggerSuppress").click(function() { $("div.log").text(''); $.ajax( "ajax/missing.html", { suppressErrors: true }); }); }); Trigger (process errors) Trigger (won't process errors) Check log
2K+ Views
Ajax requests produce a number of different events that you can subscribe to. There are two types of events:Local EventsThese are callbacks that you can subscribe to within the Ajax request object.$.ajax({ beforeSend: function(){ // Handle the beforeSend event }, complete: function(){ // Handle the complete event } // ...... });Global EventsThese events are broadcast to all elements in the DOM, triggering any handlers which may be listening. You can listen for these events like so:$("#loading").bind("ajaxSend", function(){ $(this).show(); }).bind("ajaxComplete", function(){ $(this).hide(); });Global events can be disabled, for a ... Read More
281 Views
ajaxSuccess() methodThe ajaxSuccess( callback ) method attaches a function to be executed whenever an AJAX request completes successfully. This is an Ajax Event.Here is the description of all the parameters used by this method −callback − The function to execute. The event object, XMLHttpRequest, and settings used for that request are passed as arguments to the callback.Assuming we have the following HTML content in result.html file:THIS IS RESULT...ExampleThe following is an example showing the usage of this method:Live Demo The jQuery Example ... Read More
640 Views
ajaxStop() methodThe ajaxStop( callback ) method attaches a function to be executed whenever all AJAX requests have ended.Here is the description of all the parameters used by this method −callback − The function to execute.Assuming we have following HTML content in result.html file:THIS IS RESULT...ExampleThe following is an example showing the usage of this method:Live Demo jQuery ajaxStop() method $(document).ready(function() { /* Global variable */ ... Read More
316 Views
ajaxSend() methodThe ajaxSend(callback) method attaches a function to be executed whenever an AJAX request is sent.Here is the description of all the parameters used by this method:callback − The function to execute. The XMLHttpRequest and settings used for that request are passed as arguments to the callback.Assuming we have the following HTML content in result.html file:THIS IS RESULT...ExampleThe following is an example showing the usage of this method:Live Demo The jQuery Example $(document).ready(function() { ... Read More