Found 8591 Articles for Front End Technology

How to manipulate CSS pseudo-elements ::before and ::after using jQuery?

David Meador
Updated on 15-Jun-2020 09:15:13

3K+ 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

How to handle jQuery AJAX error?

David Meador
Updated on 15-Jun-2020 09:04:44

2K+ 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

How to disable some jQuery global Ajax event handlers for a request?

David Meador
Updated on 15-Jun-2020 09:06:07

523 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

What is the difference between Local Events and Global Events in jQuery?

David Meador
Updated on 15-Jun-2020 09:08:05

3K+ 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

What is the difference between ajaxSuccess() and ajaxComplete() functions in jQuery?

David Meador
Updated on 15-Jun-2020 09:09:45

354 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

What is the difference between ajaxStop() and ajaxComplete() functions in jQuery?

David Meador
Updated on 15-Jun-2020 09:11:19

902 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

What is the difference between ajaxSend() and ajaxStart() functions in jQuery?

David Meador
Updated on 15-Jun-2020 09:13:18

452 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

How to get a style property on the matched element using jQuery?

David Meador
Updated on 15-Jun-2020 09:14:33

407 Views

To get a style property on the matched element, use the css() method. You can try to run the following code to get a style property on the matched element using jQuery:Live Demo $(document).ready(function(){   $("#button1").click(function(){     alert($('div').css('left'));   }); }); This is demo text. Get

How to handle jQuery AJAX success event?

David Meador
Updated on 17-Feb-2020 07:46:43

1K+ Views

To handle jQuery AJAX success event, use the ajaxSuccess() method. The 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.Let’s say we have the following HTML content in result.html −THIS IS RESULT...ExampleThe following is an example showing the usage of this method −Live Demo           jQuery ajaxSuccess() method     ... Read More

What are jQuery AJAX Events?

David Meador
Updated on 17-Feb-2020 07:44:49

357 Views

Ajax requests produce a number of different events that you can subscribe to. Let’s check the two types of events.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(); ... Read More

Advertisements