Found 10483 Articles for Web Development

How to add a new row in a table using jQuery?

Alshifa Hasnain
Updated on 12-Feb-2025 19:33:03

2K+ Views

In this article, we will learn to add a new row to a table using jQuery. jQuery, a fast and lightweight JavaScript library, in web development, dynamically adding or removing rows from a table is a common requirement, especially when dealing with forms or data entry interfaces. Use CasesThis functionality is particularly useful in scenarios such as − Creating dynamic forms where users can add multiple entries (e.g., adding multiple email addresses, phone numbers, or product details). Building data entry interfaces where the number of rows is not fixed. ... Read More

How to check whether a string contains a substring in jQuery?

Kristi Castro
Updated on 20-Jun-2020 15:56:41

2K+ Views

The jQuery :contains() Selector is used to check whether a string contains a substring in jQuery.Set the substring you are searching for in the contains() method as shown below:$(document).ready(function(){    $("p:contains(Video)").css("background-color", "blue"); });Now, let us see the complete code to check whether a string contains a substring or not:Example Live Demo               $(document).ready(function(){          $("p:contains(Video)").css("background-color", "blue");       });     Tutorialspoint This is demo text. Free Tutorials Free Video Tutorials

How to make a textarea and input type read only using jQuery?

Kristi Castro
Updated on 20-Jun-2020 15:45:47

3K+ Views

To make a textarea and input type read only, use the attr() method .For readonly, set the input type text and textarea as read only as shown below:$('input[type="text"], textarea').each(function(){    $(this).attr('readonly','readonly'); });The following is the code to set readonly to textarea and input type:Example Live Demo jQuery Example               $(document).ready(function() {          $('input[type="text"], textarea').each(function(){             $(this).attr('readonly','readonly');          });       });     readonly textarea

How to disable/ enable checkbox with jQuery?

Kristi Castro
Updated on 20-Jun-2020 15:45:00

6K+ Views

fTo disable and enable checkbox, use the attr() method.Initially set the input type checkbox and disable it −MaleNow on the click of a button, toggle between disabled and enabled checkbox −$("#button1").click(function() {    $("#sName").attr('disabled', !$("#sName").attr('disabled')); });Example Live Demo jQuery Example               $(document).ready(function() {          $("#button1").click(function() {             $("#sName").attr('disabled', !$("#sName").attr('disabled'));          });       });     Male

How to disable/enable an input box with jQuery?

Arnab Chakraborty
Updated on 22-Jun-2020 07:59:30

18K+ Views

We can easily disable input box(textbox,textarea) using disable attribute to “disabled”.$(‘elementname’).attr(‘disabled’,’disabled’);To enable disabled element we need to remove “disabled” attribute from this element.$(‘elementname’).removeAttr(‘disabled’);Example    ed                      $(document).ready(function () {             $('#btn1').click(function () {                $('input').attr('disabled', 'disabled');             });             $('#btn2').click(function () {                $('input').removeAttr('disabled');             });          });              Disable    Enable

How to globally disable an animation using jQuery?

Alshifa Hasnain
Updated on 19-Feb-2025 17:51:17

964 Views

In this article, we will learn to globally disable an animation using jQuery. In jQuery, animations are commonly used to create smooth transitions and effects. However, there might be scenarios where you want to disable animations globally, such as improving performance on low-powered devices or creating an instant response for user interactions. Using jQuery.fx.off to Disable Animations To globally disable an animation using jQuery, use the jQuery.fx.off() method, which can be set to true to disable all animations and effects. When this property is enabled, jQuery methods like .animate(), .fadeIn(), .fadeOut(), and .slideToggle() execute instantly without any animation. To enable ... Read More

How to add easing effect to your animation with jQuery?

Ricky Barnes
Updated on 21-Jun-2020 13:14:24

604 Views

To add easing effect to your animation, use the animation speed properly to form it a perfect animation for the web page. Do not speed up animation and you should know where to stop it while using animate().Here for our example, we have a button that takes you to a textarea to add an answer:    Add answer Now set the fade out property properly to set easing effect.Example Live Demo               $(document).ready(function(){          $('body').on('click', '#answer', function() {             var container = $('.new-answer');   ... Read More

How to use $.fadeTo() method to create animation in jQuery?

Alex Onsman
Updated on 22-Jun-2020 08:07:11

188 Views

The fadeTo( ) method fades the opacity of all matched elements to a specified opacity and firing an optional callback after completion.Here is the description of all the parameters used by this method −speed - A string representing one of the three predefined speeds ("slow", "def", or "fast") or the number of milliseconds to run the animation (e.g. 1000).opacity − A number between 0 and 1 denoting the target opacity.callback − This is optional parameter representing a function to call once the animation is complete.You can try to run the following code to learn how to work with fadeTo() method ... Read More

What is the difference between jQuery.animate() and jQuery.hide()?

David Meador
Updated on 22-Jun-2020 08:05:11

337 Views

jQuery animate()The animate( ) method performs a custom animation of a set of CSS properties.Here is the description of all the parameters used by this method −params − A map of CSS properties that the animation will move toward.duration − This is optional parameter representing how long the animation will run.easing − This is optional parameter representing which easing function to use for the transition.callback − This is optional parameter representing a function to call once the animation is complete.You can try to run the following code to learn how to work with jQuery animate() method:Example Live Demo   ... Read More

How can I make jQuery animations smoother?

Kristi Castro
Updated on 22-Jun-2020 08:44:07

646 Views

To make jQuery animations smoother use the easing library. Use the animation speed properly to form it a perfect animation for the web page. Do not speed up animation and you should know where to stop it while using animate().For an example, set a button, that fades out on click and displays a textarea:Add answerThe following is the textarea that generates showing smoother animation using animation() and fadeout(): You can try to run the following code to make jQuery animation smoother:Example Live Demo               $(document).ready(function(){          $('body').on('click', '#answer', function() ... Read More

Advertisements