Results for jQuery

Write a jQuery code to Restrict "number"-only input for textboxes including decimal points.

May 03, 2021

 Write a jQuery code to Restrict "number"-only input for textboxes including decimal points.

Write a jQuery code to Restrict "number"-only input for textboxes including decimal points. 

Answer : 
File Name : 

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col">
            <h2>jQuery</h2>
        </div>
        <div class="col">
            <label for="no">Enter Number : </label>
            <input type="text" id="no" value="">
        </div>
    </div>
    <script>
        $(document).ready(function(){
           $("#no").keyup(function(){
            this.value = this.value.replace(/[^0-9\.]/g,'');
           });
        });
    </script>
</body>
</html>
Write a jQuery code to Restrict "number"-only input for textboxes including decimal points. Write a jQuery code to Restrict "number"-only input for textboxes including decimal points. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to set background-image to the page.

May 03, 2021

 Write a jQuery code to set background-image to the page.

Write a jQuery code to set background-image to the page.

Answer : 
File Name : 

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col">
            <h2>jQuery</h2>
        </div>
    </div>
    <script>
        $(document).ready(function(){
            $('body').css('background-image','url("img/logo.png")');
        });
    </script>
</body>
</html>
Write a jQuery code to set background-image to the page. Write a jQuery code to set background-image to the page. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to change button text.

May 03, 2021

 Write a jQuery code to change button text.

Write a jQuery code to change button text. 

Answer : 
File Name : 

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col">
            <h2>jQuery</h2>
        </div>
        <div class="col">
            <button type="submit" value="submit" class="btn btn-primary">SUBMIT</button>
        </div>
    </div>
    <script>
        $(document).ready(function(){
            $('button').html("SAVE");
        });
    </script>
</body>
</html>
Write a jQuery code to change button text. Write a jQuery code to change button text. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to remove a specific value from an array.

May 03, 2021

 Write a jQuery code to remove a specific value from an array.

Write a jQuery code to remove a specific value from an array.

Answer : 
File Name : 

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col">
            <h2>jQuery</h2>
        </div>
        <div class="col">
            <p>Before Remove Sayali</p>
            <p id="b"></p>
            <p>After Remove Sayali</p>
            <p id="a"></p>
        </div>
    </div>
    <script>
        $(document).ready(function(){
            var student = ["Priya","Swara","Sanika","Sayali"]
            $("#b").text(student);
           student = jQuery.grep(student, function(value) {
                return value != "Sayali";
            });
            $("#a").text(student);
        });
    </script>
</body>
</html>
Write a jQuery code to remove a specific value from an array. Write a jQuery code to remove a specific value from an array. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to find absolute position of an element.

May 03, 2021

 Write a jQuery code to find absolute position of an element.


Write a jQuery code to find absolute position of an element.

Answer :
File Name : jQuery.html

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <h2>jquery</h2>
        <div class="col" id="info">
            <h3>INFO</h3>
            <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptas, magni.</p>
            <p id="pos"></p>
        </div>
    </div>
    <script>
        $(document).ready(function(){
           var a = ($('#info').position());
           $('#pos').html("Top : " + a.top + " Left : " + a.left);
        });
    </script>
</body>
</html>
Write a jQuery code to find absolute position of an element. Write a jQuery code to find absolute position of an element. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to count number of rows and columns in a table.

May 03, 2021

 Write a jQuery code to count number of rows and columns in a table.

Write a jQuery code to count number of rows and columns in a table. 

Answer : 
File Name: jQuery.html

<html>
<head>
   <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col">
            <h2>jquery</h2>
        </div>
            <table class="table table-bordered" id="table">
              <thead>
                <tr>
                    <th>NAME</th>
                    <th>Country</th>
                </tr>
              </thead>
              <tbody>
                  <tr>
                      <td>Priya</td>
                      <td>INDAI</td>
                  </tr>
                  <tr>
                      <td>Snika</td>
                      <td>USA</td>
                  </tr>
                  <tr>
                      <td>Swara</td>
                      <td>UK</td>
                  </tr>
              </tbody>
            </table>
            <p><span id="rows"></span>X<span id="cols"></span></p>
        </div>
    </div>
    <script>
        $(document).ready(function(){
            $.fn.rowCount = function() {
                return $('th', $(this).find('thead')).length;
            };
            $.fn.columnCount = function() {
                return $('tr', $(this).find('tbody , thead')).length;
            };
            var rowctr = $('#table').rowCount();
            var colctr = $('#table').columnCount();
            $('#rows').text(rowctr);
            $('#cols').text(colctr);
        });
    </script>
</body>
</html>
Write a jQuery code to count number of rows and columns in a table. Write a jQuery code to count number of rows and columns in a table. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to check if an object is a jQuery object or not.

May 03, 2021

 Write a jQuery code to check if an object is a jQuery object or not.

Write a jQuery code to check if an object is a jQuery object or not.

Answer : 
File Name : jQuery.html

<html>
    <head>
        <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <title>SP Creation</title>
    </head>
    <body>
        <div id="box">
            <h2>jquery</h2>
        </div>
        <div class="col">
            Is it a <b></b>.
        </div>
        <script>
          $(document).ready(function(){
              var obj = {msg : "Hii"};
            $( "b" ).append( "" + jQuery.type(obj));
          });
        </script>
    </body>
</html>
Write a jQuery code to check if an object is a jQuery object or not. Write a jQuery code to check if an object is a jQuery object or not. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to remove all CSS classes from an application.

May 03, 2021

 Write a jQuery code to remove all CSS classes from an application.

Write a jQuery code to remove all CSS classes from an application.

Answer :
File Name : jQuery.html

<html>
    <head>
        <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <title>SP Creation</title>
    </head>
    <body>
        <div id="box">
            <h2>jquery</h2>
        </div>
        <div class="col">
            <p id="text" class="bg-secondary text-center">Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis, fugiat.</p>
        </div>
        <script> 
            $(document).ready(function(){
               $('*').removeClass();
            });
        </script>
    </body>
</html>
Write a jQuery code to remove all CSS classes from an application. Write a jQuery code to remove all CSS classes from an application. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to demonstrate how to get the value of a textbox.

May 03, 2021

 Write a jQuery code to demonstrate how to get the value of a textbox.

Write a jQuery code to demonstrate how to get the value of a textbox. 

Answer : 

File Name : jQuery.html


<html>

<head>

    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>

    <title>SP Creation</title>

</head>

<body>

    <div class="container">

        <div class="col">

            <h2>jQuery</h2>

        </div>

        <div class="col">

            <label for="no">Enter Number : </label>

            <input type="text" id="text_t" value="">

            <p id="t"></p>

        </div>

    </div>

    <script>

        $(document).ready(function(){

            $("#text_t").keydown(function(){

                var text_value = $(this).val();

                $('#t').html(text_value);

            });

        });

    </script>

</body>

</html>

Write a jQuery code to demonstrate how to get the value of a textbox. Write a jQuery code to demonstrate how to get the value of a textbox. Reviewed by technical_saurabh on May 03, 2021 Rating: 5

Write a jQuery code to underline all the words of a text.

May 02, 2021

 Write a jQuery code to underline all the words of a text.

Write a jQuery code to underline all the words of a text.

Answer :
File Name : jQuery.html

<html>
    <head>
        <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <title>SP Creation</title>
    </head>
    <body>
        <div id="box">
            <h2>jquery</h2>
        </div>
        <div class="col">
            <p id="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis, fugiat.</p>
        </div>
        <script> 
            $(document).ready(function(){
                $('p').each(function() {
                    var words = $(this).text().split(' ');
                        for (i = 0; i < words.length; i++) {
                            if (i === 0) {
                                $("#text").html('<u>' + words[i] + '</u');
                            } else {
                                $("#text").append(' <u>' + words[i] + '</u>');
                            }
                        }   
                });
            });
        </script> 
    </body>
</html>
Write a jQuery code to underline all the words of a text. Write a jQuery code to underline all the words of a text. Reviewed by technical_saurabh on May 02, 2021 Rating: 5

Write a jQuery code to select values from a JSON object.

May 02, 2021

 Write a jQuery code to select values from a JSON object.

Write a jQuery code to select values from a JSON object.

Answer : 
File Name : 

<html>
    <head>
        <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <title>SP Creation</title>
    </head>
    <body>
        <div id="box">
            <h2>jquery</h2>
        </div>
        <div class="col"></div>
        <script> 
            $(document).ready(function(){
                student = {"1":"Priy","2":"Swara","3":"Sanika"};
                $.each(student,function(roll,name){
                    $('.col').append($("<p/>",{
                        name : name,
                        value : roll,
                        text : name
                    }));
                });
            });
        </script> 
    </body>
</html>
Write a jQuery code to select values from a JSON object. Write a jQuery code to select values from a JSON object. Reviewed by technical_saurabh on May 02, 2021 Rating: 5

Write a jQuery code to create a division (div tag) using jQuery with style tag.

May 02, 2021

 Write a jQuery code to create a division (div tag) using jQuery with style tag.


Write a jQuery code to create a division (div tag) using jQuery with style tag. 

Answer :
File Name : jQuery.html

<html>
    <head>
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <title>SP Creation</title>
    </head>
    <body>
        <div id="box">
            <h2>jquery</h2>
        </div>
        <div class="col">      
            <button id='ok'>INSERT DIV </button> 
        </div>
        <script> 
            $(document).ready(function(){
                $('#ok').click(function(){
                    $('.col').append('<div id="new" class="text-danger">'+ 'Div is Inserted </div>');
                });
            });
        </script> 
    </body>
</html>
Write a jQuery code to create a division (div tag) using jQuery with style tag. Write a jQuery code to create a division (div tag) using jQuery with style tag. Reviewed by technical_saurabh on May 02, 2021 Rating: 5

Write a jQuery code to make first word of each statement to bold.

May 02, 2021

 Write a jQuery code to make first word of each statement to bold.

Write a jQuery code to make first word of each statement to bold.

Answer : 
File Name : jQuery.html

<html>
    <head>
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <title>SP Creation</title>
    </head>
    <body>
        <div id="box">
            <h2>jquery</h2>
        </div>
        <div class="container">
            <p id="text">Lorem ipsum dolor sit amet.</p>
            <p id="text">Accusantium quas ipsum iste at?</p>
            <p id="text">Asperiores eligendi reprehenderit rem recusandae.</p>
            <p id="text">Ipsa ad dolores iste dicta?</p>
            <p id="text">Dignissimos nihil voluptates laboriosam explicabo.</p>
        </div>
            <script>
                $(document).ready(function(){
                    $('p').each(function(){  
                        var tpara = $(this);  
                        tpara.html( tpara.text().replace(/(^\w+)/,'<b>$1</b>') );  
                    }); 
                });
            </script>
    </body>
</html>
Write a jQuery code to make first word of each statement to bold. Write a jQuery code to make first word of each statement to bold. Reviewed by technical_saurabh on May 02, 2021 Rating: 5

Write a jQuery code to allow the user to enter only 15 characters into the textbox.

May 02, 2021

 Write a jQuery code to allow the user to enter only 15 characters into the textbox.

Write a jQuery code to allow the user to enter only 15 characters into the textbox.

Answer :
File Name : jQuery.html

<html>
<head>
   <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
<div id="box">
    <h2>jquery</h2>
</div>
    <div class="container">
        <form class="form-group">
            <div class="col">
                <textarea id="char" cols="50" rows="5"></textarea>
            </div>
        </form>
    </div>
    <script>
       $(document).ready(function(){
            $('#char').keydown(function(){
                var clen = $("#char").val().length;
               if(clen>15){
                this.disabled = true;
               }
            });
       });
    </script>
</body>
</html>
Write a jQuery code to allow the user to enter only 15 characters into the textbox. Write a jQuery code to allow the user to enter only 15 characters into the textbox. Reviewed by technical_saurabh on May 02, 2021 Rating: 5

Write a jQuery code to set value in input text

April 30, 2021

 Write a jQuery code to set value in input text

Write a jQuery code to set value in input text

Answer : 
File Name : jQuery.html

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col">
            <div class="col-md-3">
                <label for="name">Name</label>
            </div>
            <div class="col">
                <input type="text" name="name" id="name" class="form-control">
            </div>
            <div class="col-md-3">
                <label for="add">Address</label>
            </div>
            <div class="col">
                <input type="text" name="add" id="add" class="form-control">
            </div>
        </div>
    </div>
    <script>
        $(document).ready(function(){
            $('#name').val("SP Creation");
            $("#add").val("Mumbai Bendra"); 
        });
    </script>
</body>
</html>
Write a jQuery code to set value in input text Write a jQuery code to set value in input text Reviewed by technical_saurabh on April 30, 2021 Rating: 5

Write a jQuery code to disable a link.

April 30, 2021

 Write a jQuery code to disable a link.

Write a jQuery code to disable a link.

Answer :
File Name : 

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div id="box" class="col border">
          <a href="www.google.com" id="sp">Google</a>
        </div>
    </div>
    <script>
        $(document).ready(function(){
            $('#sp').click(function(){
                event.preventDefault();
            });
        });
    </script>
</body>
</html>
Write a jQuery code to disable a link. Write a jQuery code to disable a link. Reviewed by technical_saurabh on April 30, 2021 Rating: 5

Write a jQuery code to get the selected value and currently selected text of a dropdown box.

April 30, 2021

 Write a jQuery code to detect whether the user has pressed 'Enter key' or not

Write a jQuery code to get the selected value and currently selected text of a dropdown box. 

Answer:
File Name : jQuery.html

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
            <div class="col">
                <select name="sel" id="sel" class="form-control">
                    <option value="India">India</option>
                    <option value="US">US</option>
                    <option value="UK">UK</option>
                </select>
            </div>
            <div class="col" id="sel1">
            </div>
    </div>
    <script>
        $(document).ready(function(){
            $("#sel").change(function(){
                var a = $(this).val();
                $("#sel1").html(a);
            });
        });
    </script>
</body>
</html>
Write a jQuery code to get the selected value and currently selected text of a dropdown box. Write a jQuery code to get the selected value and currently selected text of a dropdown box. Reviewed by technical_saurabh on April 30, 2021 Rating: 5

Write a jQuery code to add options to a drop-down list.

April 30, 2021

Write a jQuery code to add options to a drop-down list.


Write a jQuery code to add options to a drop-down list.

Answer : 
File Name : jQuery.html

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col" id="box">
            <select name="sel" id="sel" class="form-control">
                <option value="India">India</option>
                <option value="US">US</option>
                <option value="UK">UK</option>
            </select>
        </div>
        <button id="add">Add</button>
    </div>
    <script>
        $(document).ready(function(){
            $("#add").click(function(){
                $("select").append("<option>New Country</obtion>");
            });
        });
    </script>    
</body>
</html>
Write a jQuery code to add options to a drop-down list. Write a jQuery code to add options to a drop-down list. Reviewed by technical_saurabh on April 30, 2021 Rating: 5

Write a jQuery code to display form data onto the browser.

April 30, 2021

 Write a jQuery code to display form data onto the browser.


Write a jQuery code to display form data onto the browser.

Answer : 
File Name : jquery.html

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col">
            <form id="form">
                <div class="col-md-3">
                    <label for="name">Name</label>
                </div>
                <div class="col">
                    <input type="text" name="name" id="name" class="form-control">
                </div>
                <div class="col-md-3">
                    <label for="add">Address</label>
                </div>
                <div class="col">
                    <input type="text" name="add" id="add" class="form-control">
                </div>
                <div class="col">
                    <label for="sel">Select Option</label>
                </div>
                <div class="col">
                    <select name="sel" id="sel" class="form-control">
                        <option value="India">India</option>
                        <option value="US">US</option>
                        <option value="UK">UK</option>
                    </select>
                </div>
                <div class="col" id="sel1">
                </div>
                <button id="submit" type="submit">SUBMIT</button>
            </form>
            <table class="table table-bordered" id="table">
                <tr>
                    <th>NAME</th>
                    <th>Address</th>
                    <th>Country</th>
                </tr>
            </table>
        </div>
    </div>
    <script>
        $(document).ready(function(){
            $('#form').submit(function(e){
                e.preventDefault();
              var name =  $('#name').val();
              var add = $('#add').val();
              var sel = $('#sel').val();
              $('#table').append("<tr>"+"+<td>"+name+"</td>"+"<td>"+add+"</td>"+"<td>"+sel+"</td>"+"</tr>");
            });
        });
    </script>
</body>
</html>
Write a jQuery code to display form data onto the browser. Write a jQuery code to display form data onto the browser. Reviewed by technical_saurabh on April 30, 2021 Rating: 5

Write a jQuery code to remove all the options of a select box and then add one option and select it.

April 30, 2021

Write a jQuery code to remove all the options of a select box and then add one option and select it.

Write a jQuery code to remove all the options of a select box and then add one option and select it. 

Answer :
File Name : 

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>SP Creation</title>
</head>
<body>
    <div class="container">
        <div class="col" id="box">
           <select name="select" id="sel">
               <option value="1">Item 1</option>
               <option value="2">Item 2</option>
               <option value="3">Item 3</option>
              
           </select>
        </div>
        <button id="remove">Remove</button>
        <button id="add">Add New</button>
    </div>
    <script>
        $(document).ready(function(){
            $("#add").click(function(){
                $("select").append("<option>Item NEW</option>");
            });
            $("#remove").click(function(){
                $("select").empty();
            });
        });
    </script>    
</body>
</html>
Write a jQuery code to remove all the options of a select box and then add one option and select it. Write a jQuery code to remove all the options of a select box and then add one option and select it. Reviewed by technical_saurabh on April 30, 2021 Rating: 5
Subscribe to: Posts ( Atom )
Powered by Blogger.