- 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 766 Articles for JQuery
![Kristi Castro](https://www.tutorialspoint.com/assets/profiles/44730/profile/60_19515-1530624995.png)
5K+ Views
To call a jQuery function after a certain delay, use the siteTimeout() method. Here, jQuery fadeOut() function is called after some seconds.You can try to run the following code to learn how to work with setTimeout() method in jQuery to call a jQuery function after a delay −ExampleLive Demo $(document).ready(function(){ $("#button1").bind("click",function() { setTimeout(function() { $('#list').fadeOut();}, 2000); }); }); Voice Speak Write The above content will fade out after 2 seconds
![Kristi Castro](https://www.tutorialspoint.com/assets/profiles/44730/profile/60_19515-1530624995.png)
3K+ Views
To make a jQuery function call after “X” seconds, use the siteTimeout() method.On button click, set the following and fade out the element. Here, we have also set the milliseconds. This is the delay that would occur before fading an element:$("#button1").bind("click",function() { setTimeout(function() { $('#list').fadeOut();}, 4000); });You can try to run the following code to learn how to work with setTimeout() method in jQuery:Example Live Demo $(document).ready(function(){ $("#button1").bind("click",function() { setTimeout(function() { $('#list').fadeOut();}, 4000); }); }); India US UK The above data will fade out after 4 seconds
![Kristi Castro](https://www.tutorialspoint.com/assets/profiles/44730/profile/60_19515-1530624995.png)
2K+ Views
Use event delegation to include buttons for both add a new and delete a table row on a web page using jQuery.Firstly, set the delete button:XTo fire event on click of a button, use jQuery on() method:$(document).on('click', 'button.deletebtn', function () { $(this).closest('tr').remove(); return false; });The following is the complete code delete a row from a table using jQuery:Example Live Demo $(document).ready(function(){ var x = 1; $("#newbtn").click(function () { $("table tr:first").clone().find("input").each(function () { $(this).val('').attr({ ... Read More
![Kristi Castro](https://www.tutorialspoint.com/assets/profiles/44730/profile/60_19515-1530624995.png)
3K+ Views
To add a new list element under a ul element, use the jQuery append() methodSet input type text initiallyValue: Now on the click of a button, add a new list element using the val() and append() methods in jQuery:$('button').click(function() { var mylist = $('#input').val(); $('#list').append(''+mylist+''); return false; });You can try to run the following code to learn how to add a new list element using jQuery:Example Live Demo $(document).ready(function(){ $('button').click(function() { var mylist = $('#input').val(); ... Read More
![Kristi Castro](https://www.tutorialspoint.com/assets/profiles/44730/profile/60_19515-1530624995.png)
2K+ Views
Use event delegations to include both add a new and delete a table row on a web page using jQuery.Firstly, set a button in HTML to add new row Add new Row Now under the button click event, set the code:$("#newbtn").click(function () { }Example Live Demo $(document).ready(function(){ var x = 1; $("#newbtn").click(function () { $("table tr:first").clone().find("input").each(function () { $(this).val('').attr({ 'id': function (_, id) { ... Read More
![Kristi Castro](https://www.tutorialspoint.com/assets/profiles/44730/profile/60_19515-1530624995.png)
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
![Kristi Castro](https://www.tutorialspoint.com/assets/profiles/44730/profile/60_19515-1530624995.png)
2K+ 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
![Kristi Castro](https://www.tutorialspoint.com/assets/profiles/44730/profile/60_19515-1530624995.png)
5K+ 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
![Arnab Chakraborty](https://www.tutorialspoint.com/assets/profiles/32020/profile/60_153038-1524898298.jpg)
16K+ 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
![Ricky Barnes](https://www.tutorialspoint.com/assets/profiles/13354/profile/60_84969-1512590781.jpg)
697 Views
To globally disable an animation using jQuery, use the jQuery.fx.off() method.To enable animation:$("#enable").click(function(){ jQuery.fx.off = false; });To disable animation, set jQuery.fx.off() as true:$("#disable").click(function(){ jQuery.fx.off = true; });You can try to run the following code to globally disable an animation using jQuery:Example Live Demo The jQuery Example $(document).ready(function() { $("#enable").click(function(){ jQuery.fx.off = false; }); $("#disable").click(function(){ jQuery.fx.off = true; }); ... Read More